jQuery的自动完成搜索失败

时间:2019-03-04 12:24:38

标签: 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);
        }

});

1 个答案:

答案 0 :(得分:0)

我认为您的参数不正确。我在项目中使用了它,对我来说很好用。

   // 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);
    };