首页 > 解决方案 > jquery自动完成搜索失败

问题描述

自动完成 jQuery 在搜索时不起作用。它显示了我在这里输入的所有结果都是代码。我正在使用 ajax 使用远程源

$("#crse").autocomplete({
        source: function(request, response) {

            $.ajax({
                url: "", //ur;
                type: "POST",
                data:"",
                dataType: "json",
         //     dataFilter: function(data) { return data; },
                success: function (data) {
                    console.log(data);
                    response($.map(data, function (el) {
                        return {
                            label: el.name,
                            value: el.Id,
                        };
                    }))
               console.log(data);
                }
            });
        }, 
        minLength: 2,
         focus: function (event, ui) {
             event.preventDefault();
             $("#crse").val(ui.item.label);

         },
         select: function (event, ui) {
               $("#crse").val(ui.item.value);
            event.preventDefault();

          // $("#course").val(ui.item.value);

            alert(ui.item.value);
        }

});

标签: jquery

解决方案


我觉得你的参数不对。我在我的项目中使用它对我来说工作正常。

   // auto complete for user company
    var autoCompleteOptions = {
        source: function (request, response) {
            var SearchData = JSON.stringify({ searchString: request.term });//Search string is your variable name which you are using in function
            var ajaxoptions = {
                url: "SearchURL",
                type: "POST",
                contentType: "application/json;odata=verbose",
                headers: {
                    "Accept": "application/json;odata=verbose",
                    "X-RequestDigest": $("#__REQUESTDIGEST").val()
                },
                dataType: "json",
                data: SearchData,
                success: function (data) {
                    console.log(data.SearchVendorsResult[0]);
                    response(data.SearchVendorsResult);
                }
            };
            $.ajax(ajaxoptions);
        },
        minLength: 3,
        delay: 750,
        select: function (event, ui) {
            var currentBox = $(this);
            //Your selection Logic
            return false;
        },
    };
    $("#select").autocomplete(autoCompleteOptions).autocomplete("instance")._renderItem = function (ul, item) {
        return $("<li>")
            .append("<div>" + item.NAME + "<br><span style='font-size:10px;'>" + item.ADDRESS + "</span></div><br/>");//change item.porperty according to your API
          .appendTo(ul);
    };


推荐阅读