JSで条件付きレンダリングを実装する方法は？

Question

以下は、オートコンプリートの結果関数のJS（jQuery）コードです。あなたはのプロパティを含む<li>（オートコンプリートのAJAX呼び出しの結果として出てくる）を印刷する行がいくつかあることがわかります。

<li>は条件付きプロパティはstringのように表すことができるintまたはstring（空でない文字列または空白）、または何か他のもののいずれかであることの任意の値が含まれているかどうかに基づいてレンダリングされますように、どのように私はこれを書き換えることができますか？また

$(".clients-dropdown").result(function (event, data, formatted) { 
    if (data) { 
     // set the hidden input that we need for Client entity rematerialize 
     $(".client-id").val(data.client_id); 
     if (data.ClientName && data.Address1 && data.postalcode && data.postname) { 
      $(".client-address").html(
        "<li>" + data.ClientName + "</li>" + 
        "<li>" + data.Address1 + "</li>" + 
        "<li>" + data.postalcode + " " + data.postname + "</li>" 
      ); 
      $(".client-details").html(
        "<li>" + data.PrettyId + "</li>" + 
        "<li>" + data.VatNo + "</li>" + 
        "<li>" + data.Phone + "</li>" + 
        "<li>" + data.Mobile + "</li>" + 
        "<li>" + data.Email1 + "</li>" + 
        "<li>" + data.Contact + "</li>" 
      ); 
     } 
    } 

nullがデータベースまたは空の文字列でのプロパティのためにそこにいたときに、AJAX呼び出しのために、私のサーバー側のアクションの戻りnullをすべきか？

Answer 1

空白のプロパティをテストする関数を作成します。

var getListItem = function(prop){ 
    if(!!$.trim(prop)) 
     return '<li>' + prop + '</li>'; 
    return ''; 
}; 

$(".clients-dropdown").result(function (event, data, formatted) { 
    if (data) { 
     // set the hidden input that we need for Client entity rematerialize 
     $(".client-id").val(data.client_id); 
     if (data.ClientName && data.Address1 && data.postalcode && data.postname) { 
      $(".client-address").html(
        getListItem(data.ClientName) + 
        getListItem(data.Address1) + 
        getListItem(data.postalcode + ' ' data.postname) 
      ); 
      $(".client-details").html(
        getListItem(data.PrettyId) + 
        getListItem(data.VatNo) + 
        getListItem(data.Phone) + 
        getListItem(data.Mobile) + 
        getListItem(data.Email1) + 
        getListItem(data.Contact) 
      ); 
     } 
    } 

Answer 2

ご希望の場合は必ずご確認ください。

$(".clients-dropdown").result(function (event, data, formatted) { 
var new_li = function(data) { 
    $.trim(data) != "" ? "<li>" + data + "</li>" : '' 
} 
if (data) { 

    $(".client-id").val(data.client_id); 
    if (data.ClientName && data.Address1 && data.postalcode && data.postname) { 
     $(".client-address").html(
       new_li(data.clientName) + 
       new_li(Address1) + ... // you get the idea 
     ); 
    } 
}