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

 

在項目上用到了批量刪除與批量更改狀態，前臺使用了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');
    }
});

注意：

 

一、_list 是一個對象

二、_list中的屬性須要結合後臺參數名稱,例如」selectedIDs「，組合成相似：selectedIDs[0]，selectedIDs[1]...等Request.Params

這裏是最重要的，不然後臺認不出來。這種方式也能夠傳遞自定義類的數組。組合方式就是selectedIDs[0].FirstName，selectedIDs[0].LastName，selectedIDs[1].FirstName，selectedIDs[1].LastName...

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

注意：

 

一、_list 是一個數組。

二、ajax參數中data爲{「selectedIDs」:_list}

三、這種方式比較重要的 traditional:true。或者將二、中的 _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');
    }
});