jqueryui 自动完成过滤结果(来自远程数据源) "begin with"输入

Question

我正在使用jquery autocomplete with multiple results and a remote datasource 。我能够远程提取数据并选择多个结果。 但是结果列表不会根据输入的前 2 个字符进行更新，并且 jQueryUI 文档在这个问题上的内容很少。

我进行了研究，发现 this answer在这里，并希望将其与我的函数的其余部分集成，但它不会更新结果列表。独立地，SO 答案工作得很好，但与多个结果和远程数据源集成时就不行了。

来自自动完成/远程源/多个函数(截断)。这部分工作正常:

.autocomplete({
                source: function( request, response ) {                            
                     $.ajax({
                        url: "/controller/myfunction",
                        dataType: "json",
                        data: request,
                        success: function(data){
                        if(data.response == 'true') {
                            response(data.message);
                            }
                        }
                    });
                },

<强> Possible solution在SO上:(独立工作正常，但不适用于jquery/remote/multiple代码):

var wordlist= [ "about", "above", "within", "without"];

$("#input1").autocomplete({
    source: function(req, responseFn) {
        var re = $.ui.autocomplete.escapeRegex(req.term);
        var matcher = new RegExp( "^" + re, "i" );
        var a = $.grep( wordlist, function(item,index){
            return matcher.test(item);
        });
        responseFn( a );
    }
});

我需要将此解决方案与我的代码集成。

Answer 1

来自jQuery UI Autocomplete: Search from Beginning of String你可以尝试:

$("#YOUR_TEXT_INPUT").autocomplete({
    source: function(req, response) { 
       $.ajax({
        url: "/controller/myfunction",
        dataType: "json",
        success: function( data ) {
            var re = $.ui.autocomplete.escapeRegex(req.term);
            var matcher = new RegExp( "^" + re, "i" );
            response($.grep(data, function(item){return matcher.test(item.value);}) );
            }
        });
     },
      minLength: 2,
      select: function(event, ui) {
          //custom select function if needed
       }
    });