2

我有一个在 mvc 表单提交单击时调用的 .js 文件。在那个 .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">

我总是得到'result === true',这就是为什么它将ajax发布到控制器并且它会中断。(我将来会进行服务器端验证以避免这种情况)

令人惊讶的是,即使我从“名字”字段中清除了数据,我仍然在那里看到 value="robert" ......这是个问题吗?

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

4

2 回答 2

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
  1. 下面的工作代码

    $(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(true) 员工

        <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>
    

    }

于 2013-06-14T15:45:24.777 回答
0

引用操作:

“令人惊讶的是,即使在我清除了“名字”字段中的数据后,我仍然在那里看到 value="robert" ......这是个问题吗?”

<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/

于 2013-06-14T14:47:27.367 回答