JQuery: ‘Uncaught TypeError: invocation illegale’ su richiesta jax quando il parametro data è array

Ho due elementi di selezione, A e B: quando l’opzione selezionata di A cambia, le opzioni di B devono essere aggiornate di conseguenza. Ogni elemento in A implica molti elementi in B, è una relazione uno-a-molti (A contiene nazioni, B dovrebbe contenere città situate nella nazione data).

La funzione do_ajax dovrebbe eseguire la richiesta asincrona:

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

Per aggiornare le opzioni di B ho aggiunto una chiamata di funzione nell’evento onChange di A. Ecco la funzione che viene eseguita quando viene triggersto l’evento onChange (di A ):

 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'); } 

}

Ho letto nei documenti di JQuery che i data possono essere un array (coppie di valori chiave). Ottengo l’errore se inserisco:

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

Invece, non ottengo quell’errore se i miei dati sono una stringa:

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

Ma ho bisogno della “versione dell’array” della variabile, nel mio codice php sul lato server.

The Uncaught TypeError: Illegal invocation La Uncaught TypeError: Illegal invocation si trova nel file “jquery-1.7.2.min.js”, che è tutto compresso, quindi non sono riuscito a capire quale parte di codice ha generato l’errore.

C’è qualche impostazione che posso modificare nel mio codice in modo che accetti i dati come array associativo?

Grazie al discorso con Sarfraz abbiamo potuto capire la soluzione.

Il problema era che stavo passando un elemento HTML al posto del suo valore, che è in realtà quello che volevo fare (infatti nel mio codice php ho bisogno di quel valore come chiave esterna per interrogare la tabella delle mie cities e filtrare le voci corrette).

Quindi, invece di:

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

dovrebbe essere:

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

Nota: controlla la risposta di Jason Kulatunga, cita il documento JQuery per spiegare perché il passaggio di un elemento HTML stava causando problemi.

Dai documenti jquery per processData:

processData Boolean
Predefinito: vero
Per impostazione predefinita, i dati passati all’opzione dati come object (tecnicamente, qualsiasi cosa diversa da una stringa) verranno elaborati e trasformati in una stringa di query, adattandosi al tipo di contenuto predefinito “application / x-www-form-urlencoded” . Se si desidera inviare un DOMDocument o altri dati non elaborati, impostare questa opzione su false.

Sembra che dovrai utilizzare processData per inviare i tuoi dati al server o modificare lo script php per supportare i parametri codificati di querystring.

Ho letto nei documenti di JQuery che i dati possono essere un array (coppie di valori chiave). Ottengo l’errore se inserisco:

Questo non è un array:

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

Probabilmente vuoi:

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

Ha avuto lo stesso problema di recente, risolto aggiungendo traditional: true,

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

Stavo ricevendo questo errore durante la pubblicazione di un object FormData perché non stavo configurando correttamente la chiamata Ajax. L’installazione di seguito ha risolto il problema.

  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); } }); 

Prova questo:

  $.ajax({ url:"", type: "POST", data: new FormData($('#uploadDatabaseForm')[0]), contentType:false, cache: false, processData:false, success:function (msg) {} }); 
 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; } }); }