ajax 提交陣列 泛型集合
阿新 • • 發佈:2019-02-10
轉載:http://blog.csdn.net/lingxyd_0/article/details/10428785
在專案上用到了批量刪除與批量更改狀態,前臺使用了EasyUI的DataGrid,用到了批量更改資料狀態功能。
在前臺可以獲取每條資料的ID,但是如何通過陣列方式傳遞給後臺?
通過昨晚的各種方式的除錯,終於得出了答案! 在此作為備忘。
目前有兩種方式可行:
方式一
前臺程式碼:
// 方式一 var _list = {}; for (var i = 0; i < checkedRow.length; i++) { _list["selectedIDs[" + i + "]"] = checkedRow[i].ID; } $.ajax({ url: '@Url.Action("SetCallBackStatus")', //data: { "selectedIDs": _list }, data: _list, dataType: "json", type: "POST", //traditional: true, success: function (responseJSON) { // your logic alert('Ok'); } });
注意:
1、_list 是一個物件
2、_list中的屬性需要結合後臺引數名稱,例如”selectedIDs“,組合成類似:selectedIDs[0],selectedIDs[1]...等Request.Params
這裡是最重要的,否則後臺認不出來。這種方式也可以傳遞自定義類的陣列。組合方式就是selectedIDs[0].FirstName,selectedIDs[0].LastName,selectedIDs[1].FirstName,selectedIDs[1].LastName...
3、ajax的data引數直接指定為_list
後臺程式碼:
public ActionResult SetCallBackStatus(List<int> selectedIDs) { string result = "ok"; string errMsg = ""; return this.JsonFormat(new { result = result, errMsg = errMsg }); }
方式二
前臺程式碼:
var _list = []; for (var i = 0; i < checkedRow.length; i++) { _list[i] = checkedRow[i].ID; } $.ajax({ url: '@Url.Action("SetCallBackStatus")', data: { "selectedIDs": _list }, //data: _list, dataType: "json", type: "POST", traditional: true, success: function (responseJSON) { // your logic alert('Ok'); } });
注意:
1、_list 是一個數組。
2、ajax引數中data為{“selectedIDs”:_list}
3、這種方式比較重要的 traditional:true。或者將2、中的 _list引數轉換一下$.param(_list,true)。這裡其實就是將_list作為傳統的方式傳遞給後臺。Jquery預設是做了轉換的。據說是為了使用PHP。。。。後臺語言而做的。其實也就是自動在引數後面追加了”[]“。
針對自定義的類,也可以通過方式一jquery ajax傳遞給後臺
例如:
// 自定義Person類
public class Person
{
public string FirstName { get; set; }
public string LastName { get; set; }
}
// 後臺Action
public ActionResult SetCallBackStatus(List<Person> selectedIDs)
{
string result = "ok";
string errMsg = "";
return this.JsonFormat(new { result = result, errMsg = errMsg });
}
此時前臺js可以這樣寫:
var pprds = [];
for (var i = 0; i < rows.length; i++) {
var pprd={
"FirstName":rows[i].FirstName
"LastName":rows[i].LastName
};
pprds[i]=pprd;
}
$.ajax({
type: "Post",
url: '../api/PO_PPR/UpdatePPPRD_Amount',
contentType: "application/json; charset=utf-8",
data:JSON.stringify(pprds),
beforeSend: function () {
layer.load();
},
complete: function () {
layer.close(layer.load());
},
success: function (d) {
}
});
或者:
var _list = {};
for (var i = 0; i < checkedRow.length; i++) {
_list["selectedIDs[" + i + "].FirstName"] = checkedRow[i].FirstName;
_list["selectedIDs[" + i + "].LastName"] = checkedRow[i].LastName;
}
$.ajax({
url: '@Url.Action("SetCallBackStatus")',
data: _list,
dataType: "json",
type: "POST",
success: function (responseJSON) {
// your logic
alert('Ok');
}
});