JQuery 自动完成源未更新

Question

我正在使用 jquery-ui autocomplete 插件。

下面是我如何实例化自动完成插件。

//autofill
$( "#TextArea" ).autocomplete({
    source: "search.php?option="+ option.toLowerCase(),
    minLength: 3
});

关于下拉列表更改，我正在尝试更改选项：

$('#Options').on('change',  function() {
        option = this.value.toLowerCase();
        var teaxtarea = $('#TextArea');
        //this is supposed to change the source string when the option value changes.
        teaxtarea.autocomplete( "option", "source", "search.php?option="+ option);
    }
});

我从下面的问题中得到了更新源字符串的代码。

Jquery: Possible to dynamically change source of Autocomplete widget?

但是，这个解决方案似乎对我不起作用。

即使我更改了下拉列表中的选项，我仍然得到第一个选择的选项。非常感谢任何帮助。

Answer 1

建议如下：

$("#TextArea").autocomplete({
    source: function(req, resp){
      var option = $('#Options option:selected').val().toLowerCase();
      $.ajax({
        cache: false,
        url: "search.php",
        data: {
          option: option,
          term: req.term
        },
        dataType: "json",
        success: function(data){
          resp(data);
        }
      });
    },
    minLength: 3
});

我认为一个问题是如果#Options是一个<select>元素，你需要找到被选中的子元素：

$("#Options option:selected")

这确保您拥有正确的对象，然后您可以对其调用 .val()。如果您在这里需要更多帮助，请使用 MCVE 更新您的 post：https://whosebug.com/help/mcve

这可能会为您解决问题。如果没有，继续。

其次，为确保您没有缓存，我们可以执行更多的手动源捕获。

When a string is used, the Autocomplete plugin expects that string to point to a URL resource that will return JSON data. It can be on the same host or on a different one (must support CORS). The Autocomplete plugin does not filter the results, instead a query string is added with a term field, which the server-side script should use for filtering the results.

所以我们通过一些添加的设置来复制相同的功能。因此，每次检查源时，都会检查选项并发送术语。我们将在 JSON 中取回数据并发送回自动完成以进行显示。

希望对您有所帮助。

JQuery 自动完成源未更新

JQuery Autocomplete source not updating

javascript

jquery

jquery-ui

autocomplete

jquery-ui-autocomplete