首页 > 解决方案 > 我尝试按照给出的示例使用 JQuery UI 自动完成创建一个对象,但是它目前不起作用

问题描述

我尝试使用我的代码复制 jQuery UI 的示例,但是当前未显示自动完成功能。

该示例来自此处: https ://jqueryui.com/autocomplete/#custom-data

<input id="FeatureSearch" tabindex="1" class="form-control" @*id="child-name"*@ placeholder="" required="" aria-required="true" type="text" style="width:420px;float:right"><br />
                    @*<input id="autoComplete" tabindex="1">*@    <!-- Default "id" value = "autoComplete"> -->
                    <input type="hidden" id="search-id">
                    <p id="parent-name"></p>
                    <input type="hidden" id="parent-id">    


$(function () {
        var ProductFeatures = @Html.Raw(Json.Encode(Model.AllFeatureNames))/*Json.Encode(*/@*'@Model.AllFeatureNames'*@;
     
        $("#FeatureSearch").autocomplete({
            source: ProductFeatures,
            focus: function (event, ui) {
                $("#FeatureSearch").val(ui.item.Name);
                return false;
            },
            select: function (event, ui) {
                $("#FeatureSearch").val(ui.item.Name);
                $("#search-id").val(ui.item.Id);
                if (ui.item.ParentId != null) {
                    $("#parent-name").val(ui.item.ParentName);
                    $("#parent-id").val(ui.item.ParentId);
                }
                return false;
            },
            appendTo: "#searchbox",
        }).autocomplete("instance")._renderItem = function (ul, item) {
            return $("<li>")
                .append("<div>" + item.Name + "<br>" + item.ParentName + "</div>")
                .appendTo(ul);
        };
    });

标签: javascriptjqueryasp.net-mvcjquery-ui

解决方案


推荐阅读