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

標籤：php   str   back   nbsp   ref   grid   star   length   nal   

出自：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: ‘@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 _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: { "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.   
6.             return this.JsonFormat(new { result = result, errMsg = errMsg });  
7.         }  

方式二

前台代碼：

[javascript] view plain copy

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

注意：

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.   
7.     return this.JsonFormat(new { result = result, errMsg = errMsg });  
8. }  

此時前台js可以這樣寫：

[javascript] view plain copy

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

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