65

フォームの1つでJQueryオートコンプリートを使用しています。

基本フォームは私のデータベースから製品を選択します。これはうまく機能しますが、特定の郵便番号から出荷された製品のみが返されるように、さらに開発したいと思います。バックエンドスクリプトを理解しました。このスクリプトに郵便番号を渡すための最良の方法を考え出す必要があります。

これが私のフォームの外観です。

<form>

<select id="zipcode">

<option value="2000">2000</option>
<option value="3000">3000</option>
<option value="4000">4000</option>

</select>

<input type="text" id="product"/>

<input type="submit"/>

</form>

そして、これがJQueryコードです。

$("#product").autocomplete
({
     source:"product_auto_complete.php?postcode=" + $('#zipcode').val() +"&",
     minLength: 2,
     select: function(event, ui){

                             //action

                                 }
});

このコードはある程度機能します。ただし、実際に選択されている値に関係なく、最初の郵便番号の値のみが返されます。何が起こっているのかというと、ソースURLは、選択メニューが変更されたときではなく、ページの読み込み時にプライミングされるということだと思います。これを回避する方法はありますか？それとも、私が求めている結果を達成するための全体的なより良い方法はありますか？

4

8 に答える 8

100

source次のように、呼び出しには別のアプローチを使用する必要があります。

$("#product").autocomplete({
  source: function(request, response) {
    $.getJSON("product_auto_complete.php", { postcode: $('#zipcode').val() }, 
              response);
  },
  minLength: 2,
  select: function(event, ui){
    //action
  }
});

この形式では、バインドされているときではなく、実行時に値を渡すことができます。

于 2010-09-12T09:08:46.027 に答える
34

これは複雑な男性には当てはまりません。

$(document).ready(function() {
src = 'http://domain.com/index.php';

// Load the cities straight from the server, passing the country as an extra param
$("#city_id").autocomplete({
    source: function(request, response) {
        $.ajax({
            url: src,
            dataType: "json",
            data: {
                term : request.term,
                country_id : $("#country_id").val()
            },
            success: function(data) {
                response(data);
            }
        });
    },
    min_length: 3,
    delay: 300
});
});
于 2014-02-26T23:04:01.093 に答える
9 
jQuery("#whatJob").autocomplete(ajaxURL,{
    width: 260,
    matchContains: true,
    selectFirst: false,
    minChars: 2,
    extraParams: {  //to pass extra parameter in ajax file.
        "auto_dealer": "yes",
    },
});
于 2013-11-19T06:15:48.950 に答える
6

私はあなたがあなたの呼び出しが$("#product").autocompleteページの読み込みで発火していると考えるのは正しいと信じています。おそらく、onchange（）ハンドラーを選択メニューに割り当てることができます。

$("#zipcode").change(resetAutocomplete);

#productautocomplete（）呼び出しを無効にして、新しい呼び出しを作成します。

function resetAutocomplete() {
    $("#product").autocomplete("destroy");
    $("#product").autocomplete({
         source:"product_auto_complete.php?postcode=" + $('#zipcode').val(),
         minLength: 2,
         select: function(event, ui){... }
    });
}

いくつかのサーバー呼び出しを節約するために、resetAutocomplete（）呼び出しを少し賢くすることができます（郵便番号が実際に最後の値と異なるかどうかを確認するなど）。

于 2010-09-12T03:06:20.063 に答える
3

これは私のために働きます。イベントをオーバーライドしますsearch：

jQuery('#Distribuidor_provincia_nombre').autocomplete({
    'minLength':0,
    'search':function(event,ui){
        var newUrl="/conf/general/provincias?pais="+$("#Distribuidor_pais_id").val();
        $(this).autocomplete("option","source",newUrl)
    },
    'source':[]
});
于 2012-09-02T00:34:04.387 に答える
0 
$('#txtCropname').autocomplete('Handler/CropSearch.ashx', {
    extraParams: {
        test: 'new'
    }
});
于 2014-12-29T10:34:10.600 に答える
0 
$('#product').setOptions({
    extraParams: {
        extra_parameter_name_to_send: function(){
            return $("#source_of_extra_parameter_name").val();
        }
    }
})
于 2016-06-22T12:22:27.153 に答える
0

これが誰かを助けることを願っています：

$("#txt_venuename").autocomplete({
    source: function(request, response) {
    $.getJSON('<?php echo base_url(); ?>admin/venue/venues_autocomplete', 
        { 
            user_id: <?php echo $user_param_id; ?>, 
            term: request.term 
        }, 
      response);
    },
    minLength: 3,
    select: function (a, b) {            
        var selected_venue_id = b.item.v_id;
        var selected_venue_name = b.item.label;            
        $("#h_venueid").val(selected_venue_id);
        console.log(selected_venue_id);            
    }
});

デフォルトの「term」は新しいパラメータリストに置き換えられるため、再度追加する必要があります。

于 2018-07-26T02:49:49.863 に答える