1. 程式人生 > >ajax傳遞給後臺數組參數方式

ajax傳遞給後臺數組參數方式

json ted lin -m [] logic ngx con 需要

出自:http://blog.csdn.net/lingxyd_0/article/details/10428785

在項目上用到了批量刪除與批量更改狀態,前臺使用了EasyUI的DataGrid,用到了批量更改數據狀態功能。

在前臺可以獲取每條數據的ID,但是如何通過數組方式傳遞給後臺?

通過昨晚的各種方式的調試,終於得出了答案! 在此作為備忘。

目前有兩種方式可行:

方式一

前臺代碼:

在項目上用到了批量刪除與批量更改狀態,前臺使用了EasyUI的DataGrid,用到了批量更改數據狀態功能。

在前臺可以獲取每條數據的ID,但是如何通過數組方式傳遞給後臺?

通過昨晚的各種方式的調試,終於得出了答案! 在此作為備忘。

目前有兩種方式可行:

方式一
前臺代碼:

[javascript] view plain copy
// 方式一 var _list = {}; for (var i = 0; i < checkedRow.length; i++) { _list["selectedIDs[" + i + "]"] = checkedRow[i].ID; } $.ajax({ url: [email protected]("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: [email protected]("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 _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: [email protected]("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


後臺代碼:

[csharp] view plain copy
  1. public ActionResult SetCallBackStatus(List<int> selectedIDs)
  2. {
  3. string result = "ok";
  4. string errMsg = "";
  5. return this.JsonFormat(new { result = result, errMsg = errMsg });
  6. }


方式二

前臺代碼:

[javascript] view plain copy
  1. var _list = [];
  2. for (var i = 0; i < checkedRow.length; i++) {
  3. _list[i] = checkedRow[i].ID;
  4. }
  5. $.ajax({
  6. url: [email protected]("SetCallBackStatus")‘,
  7. data: { "selectedIDs": _list },
  8. //data: _list,
  9. dataType: "json",
  10. type: "POST",
  11. traditional: true,
  12. success: function (responseJSON) {
  13. // your logic
  14. alert(‘Ok‘);
  15. }
  16. });


註意:

1、_list 是一個數組。

2、ajax參數中data為{“selectedIDs”:_list}

3、這種方式比較重要的 traditional:true。或者將2、中的 _list參數轉換一下$.param(_list,true)。這裏其實就是將_list作為傳統的方式傳遞給後臺。jQuery默認是做了轉換的。據說是為了使用PHP。。。。後臺語言而做的。其實也就是自動在參數後面追加了”[]“。

後臺代碼:

同方式一

針對自定義的類,也可以通過方式一jquery ajax傳遞給後臺

例如:

[csharp] view plain copy
  1. // 自定義Person類
  2. public class Person
  3. {
  4. public string FirstName { get; set; }
  5. public string LastName { get; set; }
  6. }
[csharp] view plain copy
  1. // 後臺Action
  2. public ActionResult SetCallBackStatus(List<Person> selectedIDs)
  3. {
  4. string result = "ok";
  5. string errMsg = "";
  6. return this.JsonFormat(new { result = result, errMsg = errMsg });
  7. }


此時前臺js可以這樣寫:

[javascript] view plain copy
    1. var _list = {};
    2. for (var i = 0; i < checkedRow.length; i++) {
    3. _list["selectedIDs[" + i + "].FirstName"] = checkedRow[i].FirstName;
    4. _list["selectedIDs[" + i + "].LastName"] = checkedRow[i].LastName;
    5. }
    6. $.ajax({
    7. url: [email protected]("SetCallBackStatus")‘,
    8. //data: { "selectedIDs": _list },
    9. data: _list,
    10. dataType: "json",
    11. type: "POST",
    12. //traditional: true,
    13. success: function (responseJSON) {
    14. // your logic
    15. alert(‘Ok‘);
    16. }
    17. });

ajax傳遞給後臺數組參數方式