Question

我有一个.js文件，在mvc表单提交点击时调用。在那个.js文件函数中，我试图在我向控制器发送ajax之前验证表单

我还在.js文件的顶部引用了以下脚本文件，如下所示： -

    /// <reference path="~/Scripts/jquery-1.9.1.js" />
    /// <reference path="~/Scripts/jquery-ui-1.10.0.js" />
    /// <reference path="~/Scripts/jquery.unobtrusive-ajax.js" />
    /// <reference path="~/Scripts/jquery.validate.js" />
    /// <reference path="~/Scripts/jquery.validate.unobtrusive.js" />

  save = function() {    
      var form = $("#formID");
      var result1 = $("#formID").validate();
      var result = $("#formID").valid();
      if (result === true) {
     $.ajax({ 
                url: whatever the url,
                data: form.serialize(),
                type: 'POST',
                ...............
                ..........
           });
    }
  }

我的视图是强类型的，模型类具有所有DataAnnotations。

在我的场景中，我有一个最初加载所有数据的表单，并且我正在尝试清除所有必需的字段数据并尝试提交以便我可以看到验证。当表单加载时，我可以看到带有所有数据属性的html，如下所示。

<input class="custom" data-val="true" data-val-required="First Name is required." id="txtFirstName" name="Form1[0].FirstName" placeholder="First Name" title="First Name" type="text" value="robert">

我总是得到'结果=== true'，这就是为什么它会发送到控制器的ajax帖子并且它会中断。（我将来会进行服务器端验证以避免这种情况）

令人惊讶的是，即使我从“名字”字段中清除了数据后，我仍然看到值=“罗伯特”......这是一个问题吗？

我不确定为什么这不起作用。

Answer 1

1首先使用“Chrome Developer Tool（CDT）”来调试客户端

2在下面提到的行上设置一个断点

3然后在CDT中输入以下代码，它将显示该字段是什么，以及失败的验证

**$.data($('form')[0], 'validator').errorList**
[
Object
element: input#FirstName.text-box single-line input-validation-error
message: "The FirstName field is required."
__proto__: Object

下面的工作代码

$(function () {
    // Handler for .ready() called.
    $('#mycustomsubmitbutton').click(function () {
        var $form = $('form').first();
        var result = $form.valid();
        // Put you break point in the below if condition
        if (result === true) {
            alert("form valid");
        } else {
            alert("invalid form");
        }
    });

});

@using（Html.BeginForm（））{ @ Html.ValidationSummary（真）雇员

    <div class="editor-label">
        @Html.LabelFor(model => model.FirstName)
    </div>
    <div class="editor-field">
        @Html.EditorFor(model => model.FirstName)
        @Html.ValidationMessageFor(model => model.FirstName)
    </div>

    <p>
        <input id="mycustomsubmitbutton" type="button" value="Valid the form and make an Ajax request" />
    </p>
</fieldset>

}

Answer 2

引用OP：

“即使在我清除了”名字“中的数据之后，我也感到惊讶我仍然看到那里的值=“罗伯特”......这是一个问题吗？“

<input class="custom" data-val="true"
 data-val-required="First Name is required."
 id="txtFirstName" name="Form1[0].FirstName"
 placeholder="First Name"
 title="First Name"
 type="text"
 value="robert">

value="robert"是你的问题。由于此attribute，该字段不为空。

请参阅：http://jsfiddle.net/M7skq/和http://jsfiddle.net/JszxA/

form.valid（）无法使用MVC中的.js文件

2 个答案: