自动完成无法使用 Jquery 处理搜索框答案

【问题标题】：AutoComplete not working on the Search Box using Jquery自动完成无法使用 Jquery 处理搜索框
【发布时间】：2014-08-04 19:57:47
【问题描述】：

我正在尝试在搜索文本框中获取 TypeAhead 功能。如果选择其中一个，我在表单上有 2 个单选按钮，我需要提前输入功能将主列表添加到搜索框中。

 //html
 <li> @Html.TextBox("SearchTitle") </li>

 //JavaScript
 if ($('input[name=SearchType]:checked').val() == "m") {
        var availableMasters = ["ActionScript",
                                "AppleScript",
                                "Asp"];
        $.ajax({
            cache: false,
            type: "GET",
            url: "@(Url.Action("Get", "Masters"))",
            success: function (data) {
                availableMasters = data.list;
            },
        error: function () {
            alert('No Master Available.');
        }
    });

        $("#SearchTitle").autocomplete({
            source: availableMasters
        });
    }

我的问题是表单在 ajax 调用之前绑定了 availableMasters，因此搜索文本框始终具有我在开头添加的静态文本数组，其中包含 3 个字段。我在 (data.list) 中获得了正确的大师列表，但它从未出现在文本框中。

有没有办法在ajax 调用获取master 列表后绑定列表？感谢您的关注...

【问题讨论】：

标签： javascript jquery ajax jquery-ui jquery-autocomplete

【解决方案1】：

将它包装在一个函数中，比如 init，然后在 ajax 调用成功时调用该函数。

function initSearch(){
     $("#SearchTitle").autocomplete({
         source: availableMasters
     });
}

if ($('input[name=SearchType]:checked').val() == "m") {
        var availableMasters = ["ActionScript",
                                "AppleScript",
                                "Asp"];
        $.ajax({
            cache: false,
            type: "GET",
            url: "@(Url.Action("Get", "Masters"))",
            success: function (data) {
                availableMasters = data.list;
                initSearch();
            },
        error: function () {
            alert('No Master Available.');
        }
    });
}

【讨论】：