如何在服务器端发送ajax调用，每次用户输入一些文本在jquery自动完成ajax插件

How to send ajax call on server side each time user enter some text in jquery autocomplete for ajax plugin

本文关键字：ajax jquery 文本 插件 输入 服务器端 调用 用户      更新时间：2023-09-26

嗨，我使用http://www.devbridge.com/sourcery/components/jquery-autocomplete/自动完成框。我的情况是，每当用户输入3个字符或超过3个，那么它应该启动自动完成功能，每次搜索输入的文本在数据库中。我在js中像这样绑定函数

"功能bindAutoComplete ($ id) {

    var as = $(document.getElementById($id)).autocompleteABC({
            serviceUrl: "showCountries.json",
            params: "data="+document.getElementById($id).value,
            lookupFilter: function(suggestion, originalQuery,queryLowerCase) {
                var re = new RegExp($.Autocomplete.utils.escapeRegExChars(queryLowerCase.trim()), 'gi');
                re.toString().trim();
                return re.test(suggestion.value.trim());
            },
            onSelect: function(suggestion) {
            },
            onInvalidateSelection: function() {
            }
    });
    $(document).on('onkeypress', '#'+$id, function(){
        as.setOptions({params:"data="+$(this).val()});
    });

} '

无论何时加载页面，它都会在我需要的多个地方绑定这个自动完成功能。但问题是，它绑定ajax调用的url和数据发送作为参数在页面加载只有，我不能在运行时改变这个参数。

我需要每当用户在自动完成框中输入文本时，该文本应该到服务器端并在数据库中搜索该文本，我应该在UI上抛出结果。

如何绑定此函数或更改插件代码，以便每次用户输入超过3个字符，ajax调用应该在服务器端输入该文本

我不认为你使用插件是正确的，你做了这么多的手动处理，插件应该自动为你做。

  • 你不需要在参数
    • 中传递搜索字段的值
  • 你不需要bindAutoComplete函数
    • 你不需要onkeypress事件处理程序

为什么你叫autocompleteABC而不是autocomplete ?

你的代码应该像这个例子一样简单:

var a = $('#query').autocomplete({
    serviceUrl:'service/autocomplete.ashx',
    minChars:3,
    // callback function:
    onSelect: function(value, data){ alert('You selected: ' + value + ', ' + data); }
});

其中#query是输入字段的id，您在其中键入搜索和serviceUrl是您的服务器端脚本处理请求并返回匹配

相关文章：