jquery-ui自动完成的错误操作

Question

Immediately after reloading the page when you enter a single character in the input, nothing happens. when you enter the following characters begins to complement.

Get data

`function getData(data, callback) {
            $.ajax({
                url: "myUrl" + encodeURIComponent(data),
                method: "GET",
                dataType: "JSON",
                success: callback
            })
        }`

Callback function

 `function autocompleteInput () {
       var dataInput = $("#myInput").val();
       function success(data) {
         var dataArr = [];
         for (var i = 0; i < data.data.length; i++) {
           dataArr.push(data.data[i].name);
               }
                    $("#myInput").autocomplete({
                        source: brokersNameArr,
                        delay: 500,
                        minLength: 1
                    })
                  getData(dataInput, success);
       }`

Use in html

$("#myInput").keyup($.throttle(200, autocompleteInput));

Answer 1

Would suggest the following:

var dataArr = [];
$("#myInput").autocomplete({
  source: function(req, resp){
    $.getJSON("myurl?" + req.term, function(results){
      $.each(results.data, function(k, r){
        dataArr.push(r.name);
      });
      resp(results);
    });
  },
  delay: 500,
  minLength: 1
});

You might also want to review: http://jqueryui.com/autocomplete/#multiple-remote

Using a Function for source will give you the ability to manage how the data is sent and received.

Function : The third variation, a callback, provides the most flexibility and can be used to connect any data source to Autocomplete, including JSONP. The callback gets two arguments:

• A request object, with a single term property, which refers to the value currently in the text input. For example, if the user enters "new yo" in a city field, the Autocomplete term will equal "new yo" .

• A response callback, which expects a single argument: the data to suggest to the user. This data should be filtered based on the provided term, and can be in any of the formats described above for simple local data. It's important when providing a custom source callback to handle errors during the request. You must always call the response callback even if you encounter an error. This ensures that the widget always has the correct state.

Hope this helps.