将序列化表单传递给Action并绑定到模型

时间:2012-03-16 09:12:52

标签: asp.net-mvc-3

我正在尝试绑定从Ajax调用收到的模型,但这不起作用。也许有人可以帮助我?

我使用Ajax调用ValidateFile Action

 $.ajax({
                    url: '@Url.Action("ValidateFile", "Converter")',
                    data: ({ file: fileName, formData: serializedForm }),
                    type: 'POST',
                    success: function (response) {
                        if (response.result) {
                        } else {
                            RemoveFile(fileName);
                        }
                    }
                });

Fiddler显示此类查询

file=!!!SP+Design!!!.txt&formData%5BEmail%5D=tomas%40mydomain.com

我在操作中收到数据,其中file参数已填充但formData.Email属性始终为Null

[HttpPost]
public JsonResult ValidateFile(string file, UploadOptionModel formData)
{
}

我的UploadOptionModel型号

namespace PC.Models
{
    public class UploadOptionModel
    {
        public string Email { get; set; }
    }
}

我正在尝试序列化的表单

@model PC.Models.UploadOptionModel
@using (Html.BeginForm())
{
    @Html.EditorFor(p => p.Email)
}

JS序列化功能

function serializeForm() {
    var data = $("form").serializeArray();
    var formData = {};
    for (var i = 0; i < data.length; i++) {
        formData[data[i].name] = data[i].value;
    }

    return formData;
}

1 个答案:

答案 0 :(得分:4)

您需要对数据进行JSON编码并将内容类型设置为JSON,以便模型绑定器与JSON一起使用。所以试试这个:

$.ajax({
    url: '@Url.Action("ValidateFile", "Converter")',
    data: JSON.stringify({ file: fileName, formData: serializedForm }),
    contentType: 'application/json',
    type: 'POST',
    success: function (response) {
        if (response.result) {
        } else {
            RemoveFile(fileName);
        }
    }
});