Asp.net mvc 反序列化 ajax.beginForm

Asp.net mvc deserialize ajax.beginForm

我需要传递我的模型,以这种形式构建:

using (Ajax.BeginForm("Index", null, new AjaxOptions() { UpdateTargetId = "FormContainer", HttpMethod = "Post", InsertionMode = InsertionMode.Replace, OnSuccess = "successFunc" }, new { id = "UpdateForm" }))

此方法:

public ActionResult SavePreset(DocumentFilterModel model, string name)
{
    //Do some magic
    return PartialView("Partial/FilterListPartial", model);
}

关键是默认情况下,此表单将收集报告预设,但是我需要添加选项以将预设保存在我的数据库中,这就是为什么需要 SavePreset 方法的原因。

我试过使用这个脚本:

$("#SavePresetButton").on("click", function () {
$.ajax({
    type: "POST",
    url: '@Url.Action("SavePreset", "Reports")',
    data: {
        name: $("#PresetNameEditor").val(),
        model: $("#UpdateForm").serialize()
    }
    }).success(function(result) {
        $("#FilterSettingsContainer").html(result);
    });
});

但我遇到了一个问题,我要么在 DocumentFilterModel model 中得到 null(如果将 model 参数的类型更改为 string)无法反序列化它.我尝试过的事情:

var SettingsModel = new JavaScriptSerializer().Deserialize<DocumentFilterModel>(model);
var a =  JsonConvert.DeserializeObject<DocumentFilterModel>(model);

顺便说一句,(这些过滤器位于单独的局部视图中)我想保持我的表单不变,因为我仍然需要用记录列表更新我的第二个局部视图,并且 DocumentFilterModel太大无法手动解析。

serialize 方法读取您的表单并生成一个包含您的输入元素名称和值的 url 编码字符串。所以基本上它将是一个很大的查询字符串。当您将其作为 $.ajax 调用的 data 属性 传递时,jquery 会将其用于请求正文(如 FormData)

所以当你尝试这样的事情时

data:{
        name: $("#PresetNameEditor").val(),
        model: $("#UpdateForm").serialize()
     }

它正在尝试发送这样的对象

{name: "Abc", model: "FirstName=Scott&Email=someEmail"}

您可以看到您有一个具有 2 个属性的 js 对象,第二个 属性 具有查询字符串格式的所有输入值。模型绑定器无法读取此数据并映射到您的 DocumentFilterModel 对象!

您不能混合 serialize 方法的结果来构建要作为数据发送的 js 对象。

只需使用serialize的结果作为ajax调用的数据属性值,并在查询字符串中传递名称。

$("#SavePresetButton").on("click", function () {
    $.ajax({
        type: "POST",
        url: '@Url.Action("SavePreset", "Reports")?name='+$("#PresetNameEditor").val(),
        data: $("#UpdateForm").serialize()
    }).done(function(result) {
        console.log(result);
    });
});