Jquery 如何将这个js数组传递给我的MVC3控制器?
我在控制器中得到空值。不知道我错过了什么 我有一个网格,其中有一个客人列表(带有姓名和电子邮件),用户可以在其中选中guest by复选框 然后我阅读了所选联系人的姓名和电子邮件,并构建了js数组。 然后将该数组传递给Jquery 如何将这个js数组传递给我的MVC3控制器?,jquery,ajax,json,asp.net-mvc-3,Jquery,Ajax,Json,Asp.net Mvc 3,我在控制器中得到空值。不知道我错过了什么 我有一个网格,其中有一个客人列表(带有姓名和电子邮件),用户可以在其中选中guest by复选框 然后我阅读了所选联系人的姓名和电子邮件,并构建了js数组。 然后将该数组传递给MVC 3控制器 JS代码: var name ='', email=''; var guest = new Array(); var guests = new Array(); $('.CBC').each(function
MVC 3控制器
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; }
}
[HttpPost]
公共行动结果添加来宾(列出来宾)
{
GuestService svc=新的GuestService();
//和客人做点什么
//但来宾中所有项目的名称和电子邮件均为空!!!
}
公共类SelectedGuest
{
//表示联系人网格的电子邮件列
公共字符串电子邮件{get;set;}
//表示接触网格的“名称”列
公共字符串名称{get;set;}
}
我是否需要显式地将js数组转换为json对象来序列化它?如果您可以自由使用插件,请尝试: 也许将“传统”设置更改为“真”会有所帮助。下面是我用来向控制器操作发布唯一标识符(guid)的(修改过的)代码
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();
}
[HttpPost]
public ActionResult ActionName(列出数组)
{
返回视图();
}
您还可以创建自定义模型活页夹。这使您可以编写代码,从请求对象接收原始输入并从中创建对象。这将允许您创建一个字符串列表或任何其他您希望在控制器中作为对象看到的内容。它也是非常可重用的
$.ajax({
type: "POST",
url: "yourUrl",
data: JSON.stringify(yourArray),
contentType: "application/json; charset=utf-8"
});
contentType:“application/json;charset=utf-8”是非常重要的部分
[HttpPost]
public void Fake(List<yourType> yourArray)
{
}
[HttpPost]
public void Fake(列出数组)
{
}
由于以错误的方式发送json数组,因此会得到null
首先,您应该序列化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();
}
[HttpPost]
公共ActionResult ActionName(字符串来宾)
{
//这条线使客人多样化。。。
IList gs=
新的JavaScriptSerializer()。反序列化(来宾);
//…用gs做任何事。。。
返回视图();
}
我试过这个,它很有效
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只需在ajax中设置'traditional:true“ 示例:
$.ajax({
type: "POST",
url: GetURL(),
data: PostData ,
dataType: "json",
traditional:true,
success: function (res) {
//do something
}
});
您在
字符串id
中指定了什么?id是一个字符串。它被正确传递。为了清晰起见,我正在删除id参数。我的ajax调度程序是通用的。我不希望仅针对这一个用例使用传统:true,除非这是我的最后一个选项。您的示例更简单,因为它只有id。我在另一个数组中有一个数组列表[{name:”,email:“},{},{}]这就是我使用的。它简单明了。我可以想出另一个选项,修改html,然后使用serializeArray()
发布到控制器。如果需要,我会详细说明。为什么要使用jQuery插件来实现json-。-只需使用json即可。stringify
对我不起作用。当我设置ContentType时,根本不会传递任何数据!
$.ajax({
type: "POST",
url: GetURL(),
data: PostData ,
dataType: "json",
traditional:true,
success: function (res) {
//do something
}
});