数据注释在部分 ASP.NET MVC 中不起作用 jquery 不显眼的验证

Posted 2023-05-09

【中文标题】数据注释在部分 ASP.NET MVC 中不起作用 jquery 不显眼的验证

【英文标题】：Data Annotations not working jquery unobtrusive validation in Partial ASP.NET MVC

【发布时间】：2014-11-07 16:24:57

【问题描述】：

所以我尝试使用以下 DataAnnotations：

    [Required(ErrorMessage = "A Description Is Required.")]
    [StringLength(500, ErrorMessage = "The Description must be at least 2 characters long.", MinimumLength = 2)]
    public string description  get; set; 

DataAnnotations 在我的 <input /> 元素响应中为我的描述属性填充数据属性：

<input maxlength="500" class="form-control" data-val="true" data-val-length="The Description must be at least 2 characters long." data-val-length-max="500" data-val-length-min="2" data-val-required="A Description Is Required." id="Add_description" name="Add.description" required="required" type="text" value="">

我正在引用脚本/js 库：

jQuery Validation Plugin 1.13.1
Microsoft jQuery Unobtrusive Validation 3.2.2
Microsoft jQuery Unobtrusive Ajax 3.2.2 

我不确定是否需要 Microsoft jQuery Unobtrusive Ajax 库，但我阅读了此 answer，因为我也在尝试进行范围验证，但该验证不起作用但我专注于我的描述属性的必需消息对于这个问题, 保持简单。

这是我的查看代码（请理解我的 Bootstrap 模态在 html 语法上是正确的，我刚刚为 Bootstrap 模态排除了一些 HTML 元素，以使代码更易于阅读我的问题）：

    @using (Html.BeginForm("CustomFieldAddNew", "CustomField", null, FormMethod.Post, new  @role = "form", id = "CustomFieldAddForm", enctype = "multipart/form-data" ))
        
            @Html.HiddenFor(mi => mi.Add.custom_field_context_id)

            <div class="modal-body">

                <div class="table-responsive">
                    <table class="table table-striped table-bordered">
                        <thead>
                            <tr>
                                <th colspan="2">General Information </th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr>
                                <td>
                                    <label for="">Description<i class="icon-asterisk"></i></label>
                                </td>
                                <td>
                                    <div class="col-md-8 padding-0">
                                        @Html.TextBoxFor(mi => mi.Add.description, new  @class = "form-control", @MaxLength = "500", required = "required" )
                                        @Html.ValidationMessageFor(mi => mi.Add.description)
                                    </div>
                                </td>
                            </tr>
                          </tbody>
                        </table>
                    </div>
                </div>
            </div>
            <!-- /.modal-body -->
            <div class="modal-footer">
                <button id="btnCloseSaveModal" type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                <button id="btnCustomFieldSave" type="button" class="btn btn-primary">Save</button>
            </div>
        

<script>
        $('#btnCustomFieldSave').on('click', function () 
        var $form = $(this).parents('form');

        var postData = 
            description: $('#@Html.IdFor(mi => mi.Add.description)').val()
        

        if ($form.validate().form()) //fire jQuery validation
            $.ajax(
                type: "POST",
                url: $form.attr('action'),
                contentType:"application/json",
                data: JSON.stringify(postData),
                error: function (xhr, status, error) 
                    toastr.error("Error saving, please try again.");
                ,
                success: function (data) 
                    $('#customField').modal('toggle');
                    $form.trigger("reset");
                
            );
        

        return false;
    );
);
</script>

我的客户端验证消息应该是：

"A Description Is Required."

但是，当我单击 btnCustomFieldSave 时，我的 jQuery CLICK 侦听器函数将触发并调用 $form.validate()，验证错误消息显示为“此字段是必需的”。这是 jQuery Validation Plugin 1.13.1 库中的默认消息。

我的问题是，为什么我的 DataAnnotation 消息“需要描述”而不是罐装的 jQuery 验证插件消息“此字段是必需的”

注意，我是否包含@Html.ValidationMessageFor(mi => mi.Add.description) 行。我仍然看到“此字段是必需的”，而不是在 DataAnnotation 属性 Required 中定义的自定义消息，即“需要描述”

【参考方案1】：

因此，在我的部分表单内容加载之前，Microsoft jQuery Unobtrusive Validation 已经触发了它的解析并绑定到数据属性。

我需要再次触发 Microsoft jQuery Unobtrusive Validation 解析，所以我在 Partial 的底部添加了：

$(function () 
        //Microsoft Unobtrusive jQuery validation has already binded so must kick off parse to bind partial loaded dynamic form
        $.validator.unobtrusive.parse($('#CustomFieldAddForm'));
);

我在这里找到了答案：Data Annotations / Validation not working for partial views