在jquery ajax post上使用mvc 3进行不显眼的验证时遇到了麻烦

I have having a lot of trouble getting validation to work on MVC3. It works fine when I just load the page directly, but it does not validate when I use jquery AJAX POST:

我在获得对MVC3的验证方面有很多困难。当我直接加载页面时，它工作得很好，但是当我使用jquery AJAX POST时，它不会生效:

This form is loaded using $('#modal-dialog').load('/DartsMVC/Restaurant/Edit/13'), This is the rendered HTML:

此表单使用$('#modal-dialog').load('/ darsmvc /Restaurant/Edit/13')加载，这是呈现的HTML:

<form action="/DartsMVC/Restaurant/Edit/13" method="post">
    <fieldset>
        <legend>Restaurant</legend>

        <input data-val="true" data-val-number="The field RestaurantID must be a number." data-val-required="The RestaurantID field is required." id="RestaurantID" name="RestaurantID" type="hidden" value="13">

        <div class="editor-label">
            <label for="Name">Name</label>
        </div>
        <div class="editor-field">
            <input class="text-box single-line" data-val="true" data-val-required="The Name field is required." id="Name" name="Name" type="text" value="furaibo">
            <span class="field-validation-valid" data-valmsg-for="Name" data-valmsg-replace="true"></span>
        </div>

        <p>
            <input type="submit" value="Save" class="ui-button ui-widget ui-state-default ui-corner-all" role="button" aria-disabled="false">
        </p>
    </fieldset>
</form>

AJAX POST is used by intercepting the form/submit. The modal dialog pops up and closes itself after the post completes. I would like to validate the form before sending the post:

AJAX POST用于拦截表单/提交。模态对话框弹出并在post完成后关闭。我想在发送邮件之前先验证一下表格:

// force change the submit data to an ajax POST (usually 'save', 'delete' button)
$('#modal-dialog').delegate('form', 'submit', function (e) {
    e.preventDefault();
    var form = $(this);
    form.validate(); // does nothing
    if (form.valid()) {
        $.ajax({
            url: form.attr('action'),
            type: "POST",
            data: form.serialize(),
            success: function (data) {
                $('#modal-dialog').dialog('close');
            },
            error: function (jqXhr, textStatus, errorThrown) {
                alert("Error '" + jqXhr.status + "' (textStatus: '" + textStatus + "', errorThrown: '" + errorThrown + "')");
            }
        });
    }
});

Did I break something by doing this? .valid() always returns true.

我这样做是不是破坏了什么东西?.valid总是()返回true。

My web.config has:

我的网络。配置有:

  <appSettings>
    <add key="ClientValidationEnabled" value="true" />
    <add key="UnobtrusiveJavaScriptEnabled" value="true" />
  </appSettings>

My page source has:

我的页面源代码:

<link href="/DartsMVC/Content/themes/cupertino/jquery-ui-1.8.14.custom.css" rel="stylesheet" type="text/css">

<script src="/DartsMVC/Scripts/modernizr-1.7.min.js" type="text/javascript"></script>
<script src="/DartsMVC/Scripts/jquery-1.5.1.min.js" type="text/javascript"></script>
<script src="/DartsMVC/Scripts/jquery-ui-1.8.14.custom.min.js" type="text/javascript"></script>

<script src="/DartsMVC/Scripts/jquery.unobtrusive-ajax.js" type="text/javascript"></script>
<script src="/DartsMVC/Scripts/jquery.validate.js" type="text/javascript"></script>
<script src="/DartsMVC/Scripts/jquery.validate.unobtrusive.js" type="text/javascript"></script>

And my model has:

和我的模型有:

    [Required]
    public string Name { get; set; }

After more research, I think it may have something to do with dynamic controls:

经过更多的研究，我认为这可能与动态控制有关:

• Since the data-val attributes exist it is not a Form scope issue
• 由于数据val属性存在，所以不是表单范围问题
• I'll try calling $.validator.unobtrusive.parse('#formid'). If that doensn't work, I'll use this last resort:
• 我会叫.validator.unobtrusive.parse美元(“# formid”)。如果那行不通，我就用最后的办法:
• http://xhalent.wordpress.com/2011/01/24/applying-unobtrusive-validation-to-dynamic-content/
• http://xhalent.wordpress.com/2011/01/24/applying-unobtrusive-validation-to-dynamic-content/

1 个解决方案

#1

Solved

解决了

Calling $.validator.unobtrusive.parse($('form')) did the trick. I guess the validator needs to be recreated for dynamic content

调用$.validator.unobtrusive.parse($('form'))就可以了。我想验证器需要为动态内容重新创建