wake-up-neo.com

Wie übergebe ich einen zusätzlichen Parameter an das Feld Jquery Autocomplete?

Ich verwende JQuery Autocomplete in einem meiner Formulare.

Das Grundformular wählt Produkte aus meiner Datenbank aus. Das funktioniert prima, aber ich würde gerne so weiterentwickeln, dass nur Produkte, die von einer bestimmten Postleitzahl verschickt werden, zurückgegeben werden. Ich habe das Backend-Skript herausgefunden. Ich muss nur herausfinden, wie ich die Postleitzahl am besten an dieses Skript weitergeben kann.

So sieht mein Formular aus.

<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>

Und hier ist der JQuery-Code:

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

                             //action

                                 }
});

Dieser Code funktioniert bis zu einem gewissen Grad. Es wird jedoch nur der erste Postleitzahlwert zurückgegeben, unabhängig davon, welcher Wert tatsächlich ausgewählt ist. Ich vermute, was passiert ist, dass die Quell-URL beim Laden der Seite vorbelegt wird, anstatt wenn das Auswahlmenü geändert wird. Gibt es einen Weg, dies zu umgehen? Oder gibt es insgesamt einen besseren Weg, um das gewünschte Ergebnis zu erzielen?

56
matt

Sie müssen für den source -Aufruf einen anderen Ansatz verwenden:

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

In diesem Format können Sie übergeben, was auch immer der Wert wenn er ausgeführt wird ist, im Gegensatz zu wenn er gebunden wird.

84
Nick Craver

Dies ist nicht zu komplizierten Männern:

$(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
});
});
26
Daniel Kennedy

Ich glaube, Sie denken zu Recht, dass Ihr Aufruf von $("#product").autocomplete beim Laden der Seite ausgelöst wird. Vielleicht können Sie dem select-Menü einen onchange () -Handler zuweisen:

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

und lassen Sie den #product - Aufruf von autocomplete () ungültig machen und einen neuen erstellen.

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

Möglicherweise möchten Sie, dass Ihr resetAutocomplete () -Aufruf etwas intelligenter ist - wie das Überprüfen, ob die Postleitzahl tatsächlich vom letzten Wert abweicht -, um einige Serveraufrufe zu sparen.

6
Paul Schreiber
jQuery("#whatJob").autocomplete(ajaxURL,{
    width: 260,
    matchContains: true,
    selectFirst: false,
    minChars: 2,
    extraParams: {  //to pass extra parameter in ajax file.
        "auto_dealer": "yes",
    },
});
5
Bharat Parmar

Diese Arbeit für mich. Überschreibe das Event 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':[]
});
3
Knito Auron
$('#txtCropname').autocomplete('Handler/CropSearch.ashx', {
    extraParams: {
        test: 'new'
    }
});
0
SrinivasNyalam
$('#product').setOptions({
    extraParams: {
        extra_parameter_name_to_send: function(){
            return $("#source_of_extra_parameter_name").val();
        }
    }
})
0
Roman Losev

Hoffe, dieser wird jemandem helfen:

$("#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);            
    }
});

Der Standardbegriff wird durch die neue Parameterliste ersetzt, daher müssen Sie ihn erneut hinzufügen.

0
Sanjoy