Jquery Ui Auto完成过滤本地JSON数组

时间:2016-08-05 16:18:38

标签: jquery jquery-ui

我拉下一个本地json数组并在我的页面加载时存储它,但是我的结果似乎没有过滤? 有什么想法吗?

var invoiceList= @Html.Raw(
        Json.Encode(
            ((IEnumerable<Invoice>)Model.InvoiceList)
            .Select(inv=> new
            {
                Id = inv.Id,
                Amount= inv.Amount
            })
        )
    );

Html结果:

  var invoiceList= [{"Id":"8da2786f-8f3d-496e-81eb-12be330cb67a","Amount":"100.00"},{"Id":"2D5A84EB-B146-43EE-8D28-8801F9F02027","Amount":"150.00"}];

HTML:

<input id="project" onkeydown="InvoiceSearch(this);">
<script>
 function InvoiceSearch(elemt) {
        var id = $(elemt).attr('id');
        var searchTerm = $(elemt).val();
        $("#project").autocomplete({
            minLength: 1,
            focus: function( event, ui ) {
                $( "#project" ).val( ui.item.Amount);
                return false;
            },
            source: invoiceList,

                select: function(event, ui)
                {
                    $("#project").val(ui.item.Amount);
                    return false; 
                }
        }).autocomplete( "instance" )
            ._renderItem = function( ul, item ) {
                console.log(item);
                return $( "<li>" )
                  .append( "<div>" + item.Amount+ "<br></div>" )
                  .appendTo( ul );
            };
    };
</script>

1 个答案:

答案 0 :(得分:0)

问题是由于名称映射, 它想要一个标签和值,我使用Id和Amount作为我的命名,因此将我的json结果重命名为label和value。

var invoiceList= [{"value":"8da2786f-8f3d-496e-81eb-12be330cb67a","label":"100.00"},{"value":"2D5A84EB-B146-43EE-8D28-8801F9F02027","label":"150.00"}];

希望这有助于其他任何人。