jquery 向MVC controller 发送数组参数

遇到了问题，在网上找到了解决方案
自己的代码是
[b]js:[/b]
var nodes = new Array();
//得到所选节点下面所有节点
getNodes(treeNode);

function getNodes(selectedNode) {

var item = { id: selectedNode.id, pId: selectedNode.pId, name: selectedNode.name, cltRnk: selectedNode.cltRnk, ncbFlg: selectedNode.ncbFlg, rcdSts: selectedNode.rcdSts };
if (selectedNode.isParent && selectedNode.children.length > 0) {
var child = selectedNode.children;
nodes.push(item);
for (var i = 0; i < child.length; i++) {
getNodes(child[i]);
}
} else {
nodes.push(item);
}
}

//传递数组参数
[b] var array = JSON.stringify({ 'array': nodes });[/b]
$.ajaxExtend({
[b]contentType: 'application/json; charset=utf-8',[/b] url: clickUrl,
data: array,
type: "post",
cache: false,
success: function (result) {
$("#" + targetDiv).html(result);
}
});


[b]MVC3 controller:[/b]
[HttpPost]
public ActionResult GetClientInfo(List<ClientTreeItem> array)
{

var ret = new PagedList<ClientTreeItem>(array, 1, 30);
return PartialView("~/Views/Client/_ClientInfo.cshtml", ret);
}

其中黑体部分是需要注意的地方，否则不加上的话后台得到的是个空。

网上原文：

I'm trying to pass an array of objects into an MVC controller method using jQuery's ajax() function. When I get into the PassThing() C# controller method, the argument "things" is null. I've tried this using a type of List for the argument, but that doesn't work either. What am I doing wrong?

<script type="text/javascript">
$(document).ready(function () {
var things = [
{ id: 1, color: 'yellow' },
{ id: 2, color: 'blue' },
{ id: 3, color: 'red' }
];

$.ajax({
contentType: 'application/json; charset=utf-8',
dataType: 'json',
type: 'POST',
url: '/Xhr/ThingController/PassThing',
data: JSON.stringify(things)
});
});
</script>

public class ThingController : Controller
{
public void PassThing(Thing[] things)
{
// do stuff with things here...
}

public class Thing
{
public int id { get; set; }
public string color { get; set; }
}
}
c# jquery asp.net-mvc jquery-ajax
share|improve this question edited Nov 6 '12 at 0:56

tereško
23.9k102972 asked Nov 6 '12 at 0:01

Halcyon
1,27821231

You can try JavaScriptSerializer.Deserialize Method (String, Type) – jk. Nov 6 '12 at 0:21
1
Your data is a string, yet your method accepts an array. Change your method to accept a string, then deserialize it within the method. – Bob Horn Nov 6 '12 at 0:36
1
Your code is correct. I tested it and it worked using MVC 4. Please provide more data to figure it out. – Diego Nov 6 '12 at 1:47

add comment (requires an account with 50 reputation)

2 Answers
active oldest votes
up vote 3 down vote accepted Using NickW's suggestion, I was able to get this working using things = JSON.stringify({ 'things': things }); Here is the complete code.

$(document).ready(function () {
var things = [
{ id: 1, color: 'yellow' },
{ id: 2, color: 'blue' },
{ id: 3, color: 'red' }
];

things = JSON.stringify({ 'things': things });

$.ajax({
contentType: 'application/json; charset=utf-8',
dataType: 'json',
type: 'POST',
url: '/Home/PassThings',
data: things,
success: function () {
$('#result').html('"PassThings()" successfully called.');
},
failure: function (response) {
$('#result').html(response);
}
});
});


public void PassThings(List<Thing> things)
{
var t = things;
}

public class Thing
{
public int Id { get; set; }
public string Color { get; set; }
}
There are two things I learned from this: 1) The contentType and dataType settings are absolutely necessary in the ajax() function. It won't work if they are missing. I found this out after much trial and error. 2) To pass in an array of objects to an MVC controller method, simply use the JSON.stringify({ 'things': things }) format.

I hope this helps someone else!