當數據參數是數組時，jQuery：'Uncaught TypeError：非法調用'在ajax請求時

Question

我有兩個select元素，A和B：當A的選擇選項更改時，B的選項必須相應更新。 A中的每個元素意味着B中的許多元素，這是一種一對多的關係（A包含國家，B包含位於特定國家的城市）。

功能do_ajax應該運行的異步請求：

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

爲了更新B的選項我已在A的onChange事件函數調用。這裏是當被觸發（的A）onChange事件運行功能：

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

}

我在JQuery docs閱讀data可以是一個數組（鍵值對）。我得到的錯誤，如果我把：

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

相反，如果我的數據是一個字符串我沒有得到這個錯誤：

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

但我需要的變量「數組版本」，在我的服務器端PHP代碼。

Uncaught TypeError: Illegal invocation位於「jquery-1.7.2.min.js」文件中，該文件全部壓縮，所以我找不出哪部分代碼會引發錯誤。

是否有任何設置可以在我的代碼中更改，以便它將數據作爲關聯數組接受？

Answer 1

感謝與Sarfraz的交談，我們可以找出解決方案。

問題是我正在傳遞一個HTML元素而不是它的值，這實際上是我想要做的事（實際上，在我的php代碼中，我需要該值作爲外鍵來查詢我的cities表和過濾器是否正確項）。

因此，而不是：

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

它應該是：

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

注：檢查傑森Kulatunga的answer，它引用JQuery的文檔解釋爲什麼傳遞一個HTML元素是造成麻煩。

Answer 2

I've read in JQuery docs that data can be an array (key value pairs). I get the error if I put:

這個對象不是一個數組：

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

你可能想：

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

Answer 3

從jQuery文檔的過程數據：

processData Boolean
^{Default: true}
By default, data passed in to the data option as an object (technically, anything other than a string) will be processed and transformed into a query string, fitting to the default content-type "application/x-www-form-urlencoded". If you want to send a DOMDocument, or other non-processed data, set this option to false.

看起來，你是將不得不使用processData來發送你的d ata到服務器，或者修改你的php腳本來支持查詢字符串編碼參數。

Answer 4

試試這個：

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

Answer 5

有同樣的問題最近，通過添加traditional: true,

Answer 6

我得到這個錯誤，而張貼FORMDATA對象，因爲我沒有正確設置Ajax調用解決。下面的設置固定我的問題。

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

Answer 7

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