使用$。员额传递对象的集合MVC控制器 [英] Passing a collection of objects to MVC controller using $.post

问题描述

我们正在尝试使用JSON从我们的网页发送对象的集合，我们的控制器（MVC 3）和.post的jQuery的功能。下面是我们的js code和控制器和对象定义。

的问题是，当对象正被适当地发送到我们​​的控制器，这是不被填充成员变量。在COORDS列表中有坐标对象适当数量但每个坐标对象的成员变量都填充了零（NOT NULL），而不是我们传递的价值观见截图：

任何想法有什么不对我们的实现？

在此先感谢！

 坐标1 = {X：100，Y：200};
Coord2 = {X：300，Y：400};zoneData = {颜色：＃D8F834，姓名：新区域，COORDS：[坐标1，Coord2]}$。员额（/演示/ SaveZone，zoneData，功能（RESP）{
     警报（RESP）;
}JSON）;[HttpPost]
公众的ActionResult SaveZone（ZoneViewModel ZVM）
{
     区域Z;     Z = AutoMapper.Mapper.Map＆LT; ZoneViewModel，区＆GT;（ZVM）;     _db.Zone.Attach（Z）;
     _db.SaveChanges（）;     返回查看（）;
}
公共类ZoneViewModel
{    公众诠释标识{搞定;组; }
    公共字符串名称{;组; }
    公共串色{搞定;组; }    公共CoordViewModel [] {COORDS获得;组; }}
公共类CoordViewModel
{
    公众诠释标识{搞定;组; }
    公众诠释X {搞定;组; }
    公众诠释Ÿ{搞定;组; }}
 

解决方案

也许最简单的是使用JSON请求：

  VAR坐标1 = {X：100，Y：200};
VAR coord2 = {X：300，Y：400};
VAR zoneData = {
    颜色：＃D8F834'，
    产品名称：新区域，
    COORDS：[坐标1，coord2]
};$阿贾克斯（{
    网址：'/演示/ SaveZone'，
    输入：POST，
    的contentType：应用/ JSON的;字符集= UTF-8，
    数据：JSON.stringify（zoneData）
    成功：函数（RESP）{
        警报（RESP）;
    }
}）;
 

的 JSON.stringify 方法序列化的JavaScript对象成JSON字符串。它内置于现代的浏览器作为一个本地方法。如果你想支持那些不具备这种方法旧版浏览器，你需要包括 json2.js 脚本，检查是否浏览器本身支持它，如果不是它提供了一个实现。

现在一切都应该正确绑定：

和这里的成功的要求会怎么看起来像：

We are trying to send a collection of objects from our page to our controller (MVC 3) using json and the jQuery .post function. Below is our js code and the controller and object definitions.

The problem is that while the object is being sent to our controller appropriately, it's member variables are not being populated. The "Coords" list has the appropriate number of "Coord" objects but each Coord object's member variables are populated with zero (not null) instead of the values we are passing in. See the screenshot:

Any ideas what is wrong with our implementation?

Thanks in advance!

Coord1 = { "X": 100, "Y": 200 };
Coord2 = { "X": 300, "Y": 400 };

zoneData = { "Color": "#D8F834", "Name": "new zone", "Coords": [Coord1, Coord2] }

$.post("/Demo/SaveZone", zoneData, function (resp) {
     alert(resp);
}, "json");





[HttpPost]
public ActionResult SaveZone(ZoneViewModel zvm)
{
     Zone z;

     z = AutoMapper.Mapper.Map<ZoneViewModel, Zone>(zvm);

     _db.Zone.Attach(z);
     _db.SaveChanges();

     return View();
}


public class ZoneViewModel
{

    public int Id { get; set; }
    public string Name { get; set; }
    public string Color { get; set; }

    public CoordViewModel[] Coords { get; set; }

}


public class CoordViewModel
{
    public int Id { get; set; }
    public int X { get; set; }
    public int Y { get; set; }

}

解决方案

Probably the easiest would be to use a JSON request:

var coord1 = { X: 100, Y: 200 };
var coord2 = { X: 300, Y: 400 };
var zoneData = { 
    Color: '#D8F834', 
    Name: 'new zone', 
    Coords: [ coord1, coord2 ] 
};

$.ajax({
    url: '/Demo/SaveZone',
    type: 'POST',
    contentType: 'application/json; charset=utf-8',
    data: JSON.stringify(zoneData),
    success: function(resp) {
        alert(resp);
    }
});

The JSON.stringify method serializes a javascript object into a JSON string. It is built into modern browsers as a native method. If you want to support legacy browsers that don't have this method you need to include the json2.js script which checks whether the browser natively supports it and if not it provides an implementation.

Now everything should bind properly:

and here's how the successful request will look like:

这篇关于使用$。员额传递对象的集合MVC控制器的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！