如何将选择列表的选项发布到MVC操作方法？

Question

我试图将选择列表中的所有项目提交给MVC 3操作方法.这是我的Action方法:

[HttpPost]
public ActionResult SaveList(int SettingID, List<SelectListItem> items)
{
    // blah...
}

这是我尝试发送数据的简化版本:

var items = $("#listItems > option").map(function ()
{
    var arr = [];
    arr.push({ Value: $(this).val(), Text: $(this).text() });
    return arr;
}).get();

$.ajax({
    type: "POST",
    url: "/CompanyAdmin/SaveSettingList/",
    dataType: 'json',
    data: { items: items, SettingID: SettingID},
    success: function (msg)
    {
        alert(msg);
    }
});

设置ID参数正确填充.并且List将使用正确的AMOUNT项填充,但Text和Value属性都将显示为null.

我是否必须为jQuery安装一个JSON插件才能提交一系列项目？

编辑1:

按照Darin Dimitrov的建议,我使用了stringify方法,并将SettingID和选项列表作为JSON发送.

起初这不是我的Action方法,所以我将方法更改为:

public ActionResult SaveList(SaveSettingListModel json)
{}

将param定义如下:(以匹配JSON)

public class SaveSettingListModel
{
    public int SettingID { get; set; }
    public List<SelectListItem> items { get; set; }
}

这现在激发了正确的方法.但是,服务器端的json的内容是SettingID = 0(当我在客户端验证它是2时),items = null.

Answer 1

尝试将它们发布为JSON.

首先定义视图模型:

public class MyViewModel
{
    public int SettingID { get; set; }
    public List<SelectListItem> Items { get; set; }
}

然后修改您的控制器操作以将此视图模型作为参数:

[HttpPost]
public ActionResult SaveList(MyViewModel model)
{
    // blah...
}

最后在你的脚本中:

var items = $('#listItems > option').map(function ()
{
    var arr = [];
    arr.push({ value: $(this).val(), text: $(this).text() });
    return arr;
}).get();

$.ajax({
    type: 'POST',
    url: '/CompanyAdmin/SaveSettingList/', // <-- use an URL Helper to generate this url instead of hardcoding it or you will cry when you deploy your application into a virtual directory
    contentType: 'application/json; charset=utf-8',
    data: JSON.stringify({ 
        items: items, 
        settingID: SettingID 
    }),
    success: function (msg) {
        alert(msg);
    }
});

如果您想JSON.stringify在旧版浏览器中使用该方法,而不是本机支持,请确保包含json2.js脚本.

所有这一切都说我看到你在这个控制器动作的位置和这个AJAX请求,我必须说我不会这样做(在请求中发送选项).我的意思是为了渲染这个视图,你从某个地方获取了这个列表？大概是一个数据存储区？因此,不要与HTML <form>(在提交时仅将下拉列表的选定值发送到服务器)进行斗争,为什么不在SaveList操作中使用这个相同的数据存储来获取那些相同的选项？这样可以避免绕过它们并节省带宽.不要担心数据库很快.如果它们不在您的情况下,只需缓存昂贵查询的结果.

如果这些选项在客户端可能会发生更改并且您想要获取新值,请完全忽略我之前的注释.