Question

下面是autocomplete结果函数的JS（jQuery）代码。你可以看到我打印出<li>个包含一些data属性的行（由于automcomplete的AJAX调用而进入）。

我怎样才能重写这个，以便根据属性是否包含<li>或int（不是空字符串或空格）或其他内容的任何值来有条件地呈现string可以表示为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>"
            );
        }
    }

另外，对于AJAX调用，当数据库中的属性为null或空字符串时，我的服务器端操作是否应返回null？

Answer 1

请注意这是否是您想要的。

$(".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
        );
    }
}

Answer 2

创建一个测试属性空白的函数。

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)
            );
        }
    }

如何在JS中实现条件渲染？

2 个答案: