8

アプリケーションの 1 つでAjax Autocomplete for Jquery( http://www.devbridge.com/projects/autocomplete/jquery/ )を使用しています。検索フォームは次のようになります。

<form id="topsearch" method="POST" action="/searchAll"><input type="text" class="searchform" name="q" id="q" value="Country, City, Hotel or a Tourist Attraction" o    nfocus="clearInput(this);" onblur="defaultInput(this);" />
  <select id="top_search_select" name="entity_type">
     <option value="country">Countries</option>
     <option value="city">Cities</option>
     <option value="place" selected="selected">Tourist Attractions</option>
     <option value="hotel">Hotels</option>
  </select>
  <input type="submit" name="topsearch" class="submit" value="SEARCH" title="SEARCH"/>
</form>

オートコンプリート構成は次のようになります。

<script type="text/javascript">
 //<![CDATA[
   var a = $('#q').autocomplete({
     serviceUrl:'/search',
     delimiter: /(,|;)\s*/, // regex or character
     maxHeight:400,
     width:325,
     zIndex: 9999,
     params: {entity_type:$('#top_search_select').val()},
     deferRequestBy: 0, //miliseconds
     noCache: false, //default is false, set to true to disable caching
     onSelect: function(value, data){window.location.replace(data);},
   });
 //]]>
</script>

問題はバックエンドにあり、ユーザーがフォームの選択オプションで選択するさまざまなタイプのエンティティの結果を生成するさまざまなハンドラーがあります。

デフォルトentity_typeではplace、バックエンドのハンドラーに問題なく渡されます。ただし、スクリプト構成のフォームの選択ボックスから別のエンティティを選択すると、人params: {entity_type:$('#top_search_select').val()}も更新されます。

どんな助けやアイデアも大歓迎です。ありがとう。

4

6 に答える 6

7

または、ajax リクエストが送信される直前に評価される関数を使用してパラメーターを指定することもできます。

$('#q').autocomplete({
    ...
    params: {
        'entity_type': function() {
            return $('#top_search_select').val();
        }
    }
    ...
});
于 2015-02-12T19:38:46.483 に答える
2

古い質問かもしれませんが、これが最善の方法だと思います：

$('#q').autocomplete({
    ...
    onSearchStart: function(q) {
        q.entity_type = $('#top_search_select').val();
    }
    ...
});
于 2014-06-11T13:21:18.003 に答える
0

あなたのプラグインサイトがhttp://www.devbridge.com/projects/autocomplete/jquery/の使用法で指定しているようsetOptionsに、返されるオブジェクトにメソッドがあり、後でオプションを動的に変更するために使用できます。

onchangeselect要素にハンドラーを追加し、paramsユーザーが次のような異なる値を選択するたびにオプションを変更します

$(function(){
  var ac = $('#q').autocomplete({
    serviceUrl:'/search',
    delimiter: /(,|;)\s*/, // regex or character
    maxHeight:400,
    width:325,
    zIndex: 9999,
    params: {entity_type:$('#top_search_select').val()},
    deferRequestBy: 0, //miliseconds
    noCache: false, //default is false, set to true to disable caching
    onSelect: function(value, data){window.location.replace(data);},
  });

  $("#top_search_select").change(function() {
      ac.setOptions({params:{entity_type:$(this).val()}});
  });


});

すべてのコードを の中に入れる必要がありますdocument ready。

于 2012-06-03T07:18:12.563 に答える
0

selects change メソッドで呼び出す必要がありますが、setOptions メソッドは機能しました。スクリプトを次のように変更します。

<script type="text/javascript">
//<![CDATA[
  var a = $('#q').autocomplete({
    serviceUrl:'/search',
    delimiter: /(,|;)\s*/, // regex or character
    maxHeight:400,
    width:325,
    zIndex: 9999,
    params: {entity_type:$('#top_search_select').val()},
    deferRequestBy: 0, //miliseconds
    noCache: false, //default is false, set to true to disable caching
    onSelect: function(value, data){window.location.replace(data);},
  });
  a.setOptions({params:{entity_type:$('#top_search_select').val()}});
//]]>
</script>

および On document ready 関数でこれを追加します:

$("#top_search_select").change(function() {
  a.setOptions({params:{entity_type:$('#top_search_select').val()}});
});
于 2012-06-03T07:55:01.670 に答える