Question

我有一个页面，其中有两个输入字段City和Venue。我有来自Devbridge 的自动完成插件，非常适合城市领域。我现在想让它在场地领域工作。我到目前为止的javascript是：

<script type="text/javascript">
    $(document).ready(function() {
        $('#Event_City').autocomplete({
          serviceUrl: '<%=Url.Action("GetCities", "Search") %>',
          minChars:2,
          width: 300,
          delimiter: /(,|;)\s*/,
          deferRequestBy: 150, //miliseconds
          params: { country: 'Yes' },
        });
        $('#Event_Venue').autocomplete({
          serviceUrl: '<%=Url.Action("GetVenues", "Search") %>',
          minChars:2,
          width: 300,
          delimiter: /(,|;)\s*/,
          deferRequestBy: 150, //miliseconds
          params: { city: $("#Event_City").val() },
        });
    });      
</script>

第二次自动完成将另一个参数（城市）传递给我的控制器上的操作。然后我会用它来限制我对那个城市场地的回应。收到此参数但不包含在#Event_City中输入的当前值。相反，它包含默认值。

有人知道如何在调用自动完成时评估该值吗？

我刚刚开始使用Javascript，所以请保持温和。

谢谢，

Answer 1

@Ian Mckay - 为了让 Venue 的自动完成功能根据城市进行过滤，您需要绑定城市的“更改”事件如下：

$(document).ready(function() {
    $('#Event_City').autocomplete({
      serviceUrl: '',
      minChars:2,
      width: 300,
      delimiter: /(,|;)\s*/,
      deferRequestBy: 150, //miliseconds
      params: { country: 'Yes' },
    }).change(function(){
        $('#Event_Venue').autocomplete({
          serviceUrl: '',
          minChars:2,
          width: 300,
          delimiter: /(,|;)\s*/,
          deferRequestBy: 150, //miliseconds
          params: { city: $("#Event_City").val() }
        });
    }); 
});

Answer 2

它包含默认值的原因是因为加载页面时自动完成功能附加到文本框。为了使用新值更新它，插件需要提供一种方法来更新它的参数对象的属性，或者允许你在第二个元素上销毁它，然后在每次用户更改第一个元素时重建它一个人的价值。您选择的AutoComplete库看起来非常轻量级（并不总是坏事......只是在您的情况下它是......）并且似乎不支持此功能。

我最好的建议是尝试另一个图书馆。我非常喜欢这个，因为它非常通用（演示页面）：

http://view.jquery.com/trunk/plugins/autocomplete/demo/

Jquery自动完成链式请求

2 个答案: