jquery - 从 ajax 发布时，MVC ModelState.isValid 始终为 true

Question

有很多与我类似的帖子，但没有一个与我遇到的问题完全相同...

我的要求是提示用户在列表中输入用户想要的任意数量的人员的名字和姓氏。第一次加载 View 时，它显示一个空表单。用户填写它，然后如果需要，要求加载有关下一个人的数据，依此类推。用户一次填充一个人的数据，然后再加载下一个人的数据。如果尝试这样做，默认验证会阻止他这样做，直到所有字段都完成为止。

因此，我有两个名称相同但值不同的提交按钮，一个用于通过 ajax 请求下一部分并将其添加到模型中的列表中，另一个用于完成请求。 httpost 方法根据按钮的名称决定采取哪个操作(添加更多或完成交易)。

但是我有一个问题，当我通过 json 在 Controller 中调用 httppost 操作方法时，模型绑定(bind)行为不正确；因此，即使我将字段留空，ModelState.IsValid 也始终等于 true。

我在 View 中的表单有一个 div，其内容如下:

    <div>
        <label for="FirstName">First Name</label>
        <div>
            @Html.EditorFor(model => model.Persons[i].FirstName)
            @Html.ValidationMessageFor(model => model.Persons[i].FirstName)
        </div>
    </div>

    <div>
        <label for="LastName">Last Name</label>
        <div>
            @Html.EditorFor(model => model.Persons[i].LastName)
            @Html.ValidationMessageFor(model => model.Persons[i].LastName)
        </div>
    </div>

我有这两个按钮，它们都提交:

        <button type="submit" name="actionType" value="AddPerson"  onclick="addPerson();">Add Another</button>
        <button type="submit" name="actionType" value="Done">Done</button>

我的模型看起来像这样:

    [Required(ErrorMessage = "First Name is required.")]
    [Display(Name = "First Name")]
    public String FirstName { get; set; }

    [Required(ErrorMessage = "Last Name is required.")]
    [Display(Name = "Last Name")]
    public String LastName { get; set; }

以及我的发布方法:

[HttpPost]
public ActionResult AddPersonMethod(MyModel mm, string actionType)
{
    if (actionType.Equals("AddPerson"))
    {
        if (ModelState.IsValid)
        {
            // add item to the list in the model
        }
    }
    return View(mm);
}

我尝试针对第一个按钮设置 ajax:

function addPerson()
{
    $.ajax({
        url: "myurl",
        type: "POST",
        data: { actionType: 'AddPerson' },
        success: function () {
            console.log('ajax succeeded');
        }
    });
}

这将根据需要进行正确的验证，但会继续到 Controller 中的 httppost(因为验证错误，它应该停止)，并且 ModelState.IsValid = true。当输入错误时如何使其停止？当它使用 ajax 发布方法时，将 ModelState.IsValid 正确设置为 false!？

仅供引用:我的 jquery.validate.js 和 jquery.validate.unobtrusive.js 已加载到我的代码中。

谢谢!

Answer 1

原因主要是因为我没有将这个包含在ajax调用的数据中:

$form.serialize()

之后我的 ajax 仍然需要进一步调整。下面是一个完美的 ajax 调用的好例子，其中包含有用的注释: http://www.codeproject.com/Tips/289820/Post-a-form-using-Ajax-instead-of-Normal-Post

我的启动按钮不必连接到事件，它可以很简单:

<input type="submit" name="actionType" value="AddPerson" />