Question

我正在试图弄清楚为什么jQuery自动完成功能在我输入的时候没有从下拉菜单中给我任何结果。我正在调用一个asp.net控制器，当我在控制台的$ .each方法中循环结果时，一切都恢复正常。我做错了什么？

$("#search").autocomplete({
    delay: 0,
    minLength: 3,
    source: function (request, patients) {

        $.get("patient/Search/", { search: request.term }, function (patients) {

            $.each(patients, function (key, value) {
                patients[key].PatientFullName;
                console.log(patients[key].PatientFullName);

            });
        });


    },

    open: function(event, patients) {
        $(".ui-autocomplete").css("z-index", 1000);

    },
    select: function (event, patients) {
        $.each(patients, function (key, value) {

            //window.location.href = "/patient/" + patients[key].PatientID;
        });

    }
});

这是从asp.net控制器返回的json

[{"PatientID":"bcf81edb-bbfe-42d1-afcf-3255ca78fb32","PatientFullName":"Smith, Shane","PatientNameAndDOB":"Smith, Shane(5-05-13)","PatientNameAgeGender":"Smith, Shane (16 month old M)","Photo":null},{"PatientID":"26fd757d-4b92-471e-9396-3c9d69f54a32","PatientFullName":"Smith, Shirley","PatientNameAndDOB":"Smith, Shirley(5-05-13)","PatientNameAgeGender":"Smith, Shirley (16 month old F)","Photo":null}]

Answer 1

根据jQuery自动完成documentation

功能：第三个变体，一个回调，提供最多灵活性，可用于连接任何数据源自动完成。回调有两个参数：一个请求对象，带有单个术语属性，指的是当前的值文字输入。例如，如果用户输入＆＃34; new yo＆＃34;在城市的领域，自动填充术语将等于＆＃34; new yo＆＃34;。 响应回调， 需要一个参数：向用户建议的数据。这个数据 应根据提供的字词进行过滤，并且可以是中的任何一个 上述简单本地数据的格式。这很重要提供自定义源回调以处理错误请求。即使您，也必须始终调用响应回调遇到错误。这可确保窗口小部件始终具有正确的状态。在本地过滤数据时，您可以使用内置$ .ui.autocomplete.escapeRegex函数。它会采取一个单一的字符串参数和转义所有正则表达式字符，产生结果安全传递给新的RegExp（）。

支持的数据类型：

String - 这基本上是要调用的URL的字符串，它将再次返回JSON：数据本身的格式可以与上述本地数据的格式相同。

这将我们带到：

阵列：

字符串数组：[＆＃34; Choice1＆＃34;，＆＃34; Choice2＆＃34; ]

具有标签和值属性的对象数组：[{label：＆＃34; Choice1＆＃34;，value：＆＃34; value1＆＃34; }，...]

基本上，为什么你没有看到任何结果是因为你要返回的JSON与数组的任何指定模式都不匹配。以及你的JS存在一些问题。

假设您返回类似于此

的JSON

[
     {
          value:"bcf81edb-bbfe-42d1-afcf-3255ca78fb32",
          label:"Smith, Shane"
     },
     {
          value:"26fd757d-4b92-471e-9396-3c9d69f54a32",
          label:"Smith, Shirley"
     }
]

然后你可以像这样使用JS：

    $("#search").autocomplete({
        delay: 0,
        minLength: 3,
        source: "home/search",
        open: function (event, patients) {
            $(".ui-autocomplete").css("z-index", 1000);

        },
        select: function (event, patients) {
            $.each(patients, function (key, value) {
            });
        }
    });

如果您因任何原因需要在客户端按摩数据，那么您可以这样做：

    $("#search").autocomplete({
        delay: 0,
        minLength: 3,
        source: function (request, response) {
            $.get("home/search", { search: request.term }, function (patients) {
                var finalResult;
                //do something to massage the patients data into finalResult
                finalResult = doWork;
                response(finalResult);
            });
        },
        open: function (event, patients) {
            $(".ui-autocomplete").css("z-index", 1000);

        },
        select: function (event, patients) {
            $.each(patients, function (key, value) {
            });
        }
    });

当我输入时，Jquery Autocomplete不返回任何建议

1 个答案: