如何将此js数组传递给我的MVC 3控制器?

时间:2011-06-13 05:41:42

标签: jquery ajax json asp.net-mvc-3

我在控制器中获取空值。不知道我错过了什么。

我有一个网格,其中有一个访客列表(名称和电子邮件),用户通过复选框选择访客。

然后我读取所选联系人的姓名和电子邮件并构建js数组。 然后将此数组传递给MVC 3 controller

JS代码:

var name ='', email='';
    var guest = new Array();
            var guests = new Array();
            $('.CBC').each(function () {  //loop grid by checkbox class
                if (this.checked) {
                    name = GetSelectedName();
                    email = GetSelectedEmail();
                    guest = { 'Email': email, 'Name': name };
                    guests.push(guest);
                }
            });

        $.ajax({
        type: "POST",
        url: GetURL(),
        data: guests,
        dataType: "json",
        success: function (res) {
           //do something
        }
});

控制器:

[HttpPost]
    public ActionResult AddGuests(List<SelectedGuest> guests)
    {            
        GuestService svc = new GuestService();
        //do something with guests
        //But Name and Email of all items in guests are null!!!
    }

public class SelectedGuest
{
    //represent the email columns of the contact grid
    public string Email { get; set; }

    //represent the Name column of the contact grid
    public string Name { get; set; }
}

我是否需要将js数组显式转换为json对象以进行序列化?

7 个答案:

答案 0 :(得分:7)

$.ajax({
            type: "POST",
            url: "yourUrl",
            data: JSON.stringify(yourArray),
            contentType: "application/json; charset=utf-8"
        });

contentType:&#34; application / json;字符集= UTF-8&#34; - 是非常重要的部分

[HttpPost]
public void Fake(List<yourType> yourArray)
{
}

答案 1 :(得分:4)

传统设置更改为true可能有所帮助。这是(修改过的)代码,我用它将唯一标识符(Guids)发布到控制器操作。

var yourArray = new Array();
// TODO: fill array with ids of checked checkboxes
$('.CBC:checked').each(function () {
   yourArray.push($(this).attr('myId'));
});

var postData = {
    yourArray: yourArray
};

$.ajax({
    type: "POST",
    url: "/ctrl/ActionName",
    data: postData,
    success: function (result) {
    },
    datatype: "json",
    traditional: true
});

在控制器中,我有以下行动。

[HttpPost]
public ActionResult ActionName(List<Guid> yourArray)
{
    return View();
}

答案 2 :(得分:3)

如果您可以自由使用插件,请尝试jQuery-JSON

var guests = new Array();

// push stuff into the array

$.ajax({
     type: "POST",
     url: GetURL(),
     data: $.toJSON(guests),
     dataType: "json",
     success: function (res) {
        //do something
     }
);

答案 3 :(得分:1)

你得到null因为你以错误的方式发送json数组。

首先,您应该序列化您的json数组:

$.ajax({
        // Whatever ...
        type: "POST",
        url: "yourUrl",
        data: JSON.stringify(guests),
        // Whatever ...
    });

其次,你的控制器应该得到一个字符串:

[HttpPost]
public ActionResult ActionName(string guests)
{
    // ...
}

最后,您应该将该字符串反序列化为相关类型:

[HttpPost]
public ActionResult ActionName(string guests)
{
    // this line eserializes guests ...

    IList<GuestType> gs = 
       new JavaScriptSerializer().Deserialize<IList<GuestType>>(guests);

    // ... Do whatever with gs ...

    return View();
}

答案 4 :(得分:1)

在你的ajax中设置'traditional:true“

示例

 $.ajax({
    type: "POST",
    url: GetURL(),
    data: PostData ,
    dataType: "json",
    traditional:true,
    success: function (res) {
       //do something
    }
});

答案 5 :(得分:0)

您还可以创建自定义模型装订器。这使您可以编写从请求对象中获取原始输入的代码并从中创建对象。这将允许您创建一个字符串列表或您希望在控制器中看到的任何其他对象。它也是非常可重复使用的。

答案 6 :(得分:0)

我试过这个,它的工作。

var name ='', email='';
var guest = new Array();
        var guests = new Array();
        $('.CBC').each(function () {  //loop grid by checkbox class
            if (this.checked) {
                name = GetSelectedName();
                email = GetSelectedEmail();
                guest = { 'Email': email, 'Name': name };
                guests.push(guest);
            }
        });

 var PostData = { guests: guests }; //if this is creating ambiguity try using something:guest //(something is //controller parameter, change your controller parameter accordingly)              

    $.ajax({
    type: "POST",
    url: GetURL(),
    data: PostData ,
    dataType: "json",
    success: function (res) {
       //do something
    }
});

干杯,

SRINIVAS