Jquery UI 自动完成 - 使用先前选择字段中的值

发布于 2024-11-03 20:35:11 字数 746 浏览 0 评论 0原文

我想自动完成城市文本输入，但仅搜索先前选择的国家/地区的城市。我的代码似乎应该可以工作，但它没有发送正确的国家/地区值。

形式：

Country: <select name='country' id='country'>
             <option value='US'>USA</option>
             <option value='UK'>United Kingdom</option>
         </select><br/>
City: <input type='text' name='city' id='city' />

js：

$( "#city" ).autocomplete({
            source: "searchCities/" + $('select#country option:selected').val(),
            minLength: 2
        });

URL 结构应为 'searchCities/UK?term=foo'，SQL 语句搜索国家代码为 'UK' 的 'term' 值。如果我手动输入 URL，它可以正常工作（仅限于国家/地区）...并且自动完成功能可以在表单中工作。但是，它返回所有城市，不受国家/地区代码限制。

我可能缺少什么吗？或者也许有更好的方法来实现这一目标？谢谢！

原文

I want to autocomplete a Cities text input, but only search for cities in the country that was previously selected. The code I have seems like it should work, but it's not sending the correct country value.

The form:

Country: <select name='country' id='country'>
             <option value='US'>USA</option>
             <option value='UK'>United Kingdom</option>
         </select><br/>
City: <input type='text' name='city' id='city' />

The js:

$( "#city" ).autocomplete({
            source: "searchCities/" + $('select#country option:selected').val(),
            minLength: 2
        });

The URL structure should be 'searchCities/UK?term=foo' and the SQL statement is searching for the value of 'term' where the country code is 'UK'. If I type in the URL manually, it works without a problem (limiting to only the country)... and the autocomplete works in the form. However, it returns ALL cities without limiting by the country code.

Is there something I may be missing? Or maybe a better way to accomplish this? Thanks!

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

思念满溢 2024-11-10 20:35:11

如果您还没有这样做 - 您应该在每次更改选择框的选定值时修改自动完成的源属性。

每次用户在选择框中选择一个新值时，您都可以销毁并重新构建自动完成功能：

<script>
   function renewAutocomplete() {
      $( "#city" ).autocomplete("destroy");
      $( "#city" ).autocomplete({
            source: "searchCities/" + $('select#country option:selected').val(),
            minLength: 2
        });
   }
</script>
Country:
<select name='country' id='country' onchange='renewAutocomplete();'>
   <option value='US'>USA</option>
   <option value='UK'>United Kingdom</option>
</select>
<br/>
City: <input type='text' name='city' id='city' />

或者最好不要销毁它并重新构建它，而是修改其源属性：

<script>
   function renewAutocomplete() {
      $( "#city" ).autocomplete("option", "source", "searchCities/" + $('select#country option:selected').val());
   }
</script>

If you are not doing so already - you should modify the autocomplete's source attribute each time the select box's selected value is changed.

you can destroy and re-build the autocomplete every time the user selects a new value into the select box:

<script>
   function renewAutocomplete() {
      $( "#city" ).autocomplete("destroy");
      $( "#city" ).autocomplete({
            source: "searchCities/" + $('select#country option:selected').val(),
            minLength: 2
        });
   }
</script>
Country:
<select name='country' id='country' onchange='renewAutocomplete();'>
   <option value='US'>USA</option>
   <option value='UK'>United Kingdom</option>
</select>
<br/>
City: <input type='text' name='city' id='city' />

or maybe it is better not to destroy it and re-build it, rather modify its source attribute:

<script>
   function renewAutocomplete() {
      $( "#city" ).autocomplete("option", "source", "searchCities/" + $('select#country option:selected').val());
   }
</script>

回复收藏 0 原文

半仙 2024-11-10 20:35:11

试试这个

    $("#city").unautocomplete().autocomplete(

              base_url+"index.php/index/autocompletecities/", 

              {

               extraParams:                 
                   {country:$('#country').val()} 

});

Try this one

    $("#city").unautocomplete().autocomplete(

              base_url+"index.php/index/autocompletecities/", 

              {

               extraParams:                 
                   {country:$('#country').val()} 

});

回复收藏 0 原文

~没有更多了~