Jquery 使用 json 和参数自动完成

Question

我正在尝试做一个自动完成输入字段。每次用户在该字段中键入一个字母时，该字段的值都会发送到服务器，并且服务器会使用匹配的单词进行答复。

var acOptions = {
             source:function (request, response) {
                 $.ajax({
                     url: "index.php?option=com_fmw&view=keywords_api&controller=keywords_api&format=raw", 
                     type: "GET", dataType: "json",
                     data: { expr: request.term},
                     success: function (data) {
                         response($.map(data, function (item) {
                             return item.value;
                         }))
                     }
                 })
                 }, 
     minChars: 1,
     dataType: 'json'
};

$( "#search_box_input" ).autocomplete(acOptions);

这是来自服务器的数据示例：

[{"value":"Greater"},{"value":"great"},{"value":"greatly"},{"value":"Greater-Axe"}]

前面的代码向服务器发出正确的请求（并且服务器做出正确的响应），但它不会在文本字段中显示任何内容。

我尝试在没有显式 ajax 对象的情况下进行自动完成，但后来无法将字段的当前值（请求的参数“expr”）发送到服务器：

var acOptions = {
        source: "index.php?option=com_fmw&view=keywords_api&controller=keywords_api&format=raw&expr=",
        minChars: 1,
        dataType: 'json'
};
$( "#search_box_input" ).autocomplete(acOptions);

谢谢您的帮助！

Answer 1

您可以使用 jQuery 提取字段的值，将其添加到 URL 参数字符串中。

var acOptions = {
        source: "index.php?option=com_fmw&view=keywords_api&controller=keywords_api&format=raw&expr=" + $('#ID_OF_YOUR_TEXTBOX').val(),
        minChars: 1,
        dataType: 'json'
};
$( "#search_box_input" ).autocomplete(acOptions);