JQuery: 'Nicht erfasster Typfehler: Unzulässiger Aufruf' bei Ajax-Anforderung - mehrere Elemente

Ich habe zwei Auswahlelemente, A und B: Wenn sich die ausgewählte Option von A ändert, müssen die Optionen von B entsprechend aktualisiert werden. Jedes Element in A impliziert viele Elemente in B, es ist eine Eins-zu-Viele-Beziehung (A enthält Nationen, B sollte Städte enthalten, die sich in der gegebenen Nation befinden).

Die Funktion do_ajaxsollte die asynchrone Anforderung ausführen:

function do_ajax(elem, mydata, filename)
{
    $.ajax({
        url: filename,
        context: elem,
        data: mydata,
        datatype: "html",
        success: function (data, textStatus, xhr) {
            elem.innerHTML = data;
        }
    });
}

Um die Optionen von B zu aktualisieren, habe ich einen Funktionsaufruf in das onChangeEreignis von A eingefügt . Hier ist die Funktion, die ausgeführt wird, wenn das onChange-Ereignis (von A) ausgelöst wird:

function my_onchange(e) // "e" is element "A"
{
    var sel_B = ... ; // get select element "B"

    // I skipped some code here
    // ...

    var data = {
        'mode': 'filter_city',
        'id_A': e[e.selectedIndex]
    };
    do_ajax(city_sel, data, 'ajax_handler.php');
}

}}

Ich habe in JQuery-Dokumenten gelesen, dass es datasich um ein Array handeln kann (Schlüsselwertpaare). Ich erhalte den Fehler, wenn ich setze:

var data = {
        'mode': 'filter_city',
        'id_A': e[e.selectedIndex]
};

Stattdessen erhalte ich diesen Fehler nicht, wenn meine Daten eine Zeichenfolge sind:

var data = 'mode=filter_city&id_A=' + e[e.selectedIndex];

Aber ich brauche die "Array-Version" der Variablen in meinem serverseitigen PHP-Code.

Das Uncaught TypeError: Illegal invocationbefindet sich in der Datei "jquery-1.7.2.min.js", die alle komprimiert ist, sodass ich nicht herausfinden konnte, welcher Teil des Codes den Fehler ausgelöst hat.

Gibt es eine Einstellung, die ich in meinem Code ändern kann, damit Daten als assoziatives Array akzeptiert werden?

Dank des Gesprächs mit Sarfraz konnten wir die Lösung finden.

Das Problem war, dass ich ein HTML-Element anstelle seines Werts übergab, was eigentlich das war, was ich tun wollte (tatsächlich benötige ich diesen Wert in meinem PHP-Code als Fremdschlüssel, um meine citiesTabelle abzufragen und korrekte Einträge zu filtern).

Also statt:

var data = {
        'mode': 'filter_city',
        'id_A': e[e.selectedIndex]
};

es sollte sein:

var data = {
        'mode': 'filter_city',
        'id_A': e[e.selectedIndex].value
};

Hinweis: Überprüfen Sie die Antwort von Jason Kulatunga . Sie zitiert das JQuery-Dokument, um zu erklären, warum das Übergeben eines HTML-Elements Probleme verursacht hat.

Aus den jQuery-Dokumenten für processData:

processData Boolean
^{Standard: true}
Standardmäßig werden Daten, die als Objekt an die Datenoption übergeben werden (technisch gesehen alles andere als eine Zeichenfolge), verarbeitet und in eine Abfragezeichenfolge umgewandelt, die dem Standardinhaltstyp "application / x-www" entspricht -form-urlencoded ". Wenn Sie ein DOMDocument oder andere nicht verarbeitete Daten senden möchten, setzen Sie diese Option auf false.

Quelle: http://api.jquery.com/jquery.ajax

Sieht so aus, als processDatamüssten Sie Ihre Daten an den Server senden oder Ihr PHP-Skript ändern, um querystring-codierte Parameter zu unterstützen.

Ich habe diesen Fehler beim Posten eines FormData-Objekts erhalten, weil ich den Ajax-Aufruf nicht richtig eingerichtet habe. Das folgende Setup hat mein Problem behoben.

var myformData = new FormData();        
myformData.append('leadid', $("#leadid").val());
myformData.append('date', $(this).val());
myformData.append('time', $(e.target).prev().val());

$.ajax({
    method: 'post',
    processData: false,
    contentType: false,
    cache: false,
    data: myformData,
    enctype: 'multipart/form-data',
    url: 'include/ajax.php',
    success: function (response) {
        $("#subform").html(response).delay(4000).hide(1); 
    }
});

Ich habe in JQuery-Dokumenten gelesen, dass Daten ein Array sein können (Schlüsselwertpaare). Ich erhalte den Fehler, wenn ich setze:

Dies ist ein Objekt, kein Array:

var data = {
        'mode': 'filter_city',
        'id_A': e[e.selectedIndex]
};

Sie wollen wahrscheinlich:

var data = [{
        'mode': 'filter_city',
        'id_A': e[e.selectedIndex]
}];

Hatte das gleiche Problem vor kurzem durch Hinzufügen gelöst traditional: true,

function do_ajax(elem, mydata, filename)
{
    $.ajax({
        url: filename,
        context: elem,
        data: mydata,
        **contentType: false,
        processData: false**
        datatype: "html",
        success: function (data, textStatus, xhr) {
            elem.innerHTML = data;
        }
    });
}

$.ajax({
                    url:"",
                    type: "POST",
                    data: new FormData($('#uploadDatabaseForm')[0]),
                    contentType:false,
                    cache: false,
                    processData:false,
                    success:function (msg) {}
                  });

Versuche dies:

            $.ajax({
                    url:"",
                    type: "POST",
                    data: new FormData($('#uploadDatabaseForm')[0]),
                    contentType:false,
                    cache: false,
                    processData:false,
                    success:function (msg) {}
                  });