未显示必填字段验证错误消息

问题描述

我正在尝试向客户端显示必填字段的错误消息,但它不起作用,我不确定我是否错过了一个步骤,或者它是否与表单数据是多部分。模型类具有使用 DataAnnotations 所需的标记

public class SupportRequestModel
{
    public int? Id { get; set; }

    [required(ErrorMessage = "Request Type is required.")]
    public int RequestTypeId { get; set; }
}

该表单同时具有 ValidationSummary() 和 ValidationMessageFor():

@using (Html.BeginForm("SaveSupportRequest","Request",FormMethod.Post,new { id = "addForm",enctype = "multipart/form-data" }))
{
    @Html.ValidationSummary(true,"",new { @class = "text-danger" })

    @Html.HiddenFor(x => x.Id,new { Id = "Id" })
    <div class="kt-portlet__body">
        <div class="row form-group">
            <div class="col-sm-3">
                <label class="kt-font-bold">Type:<span class="required">*</span></label>
                <select class="form-control" id="requestType" name="requestType"></select>
                @Html.HiddenFor(x => x.RequestTypeId,new { RequestTypeId = "RequestTypeId" })
                @Html.ValidationMessageFor(m => m.RequestTypeId,new { @class = "text-danger" })

我的 web.config 包含以下键:

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

需要注意的是,表单是使用 DropzoneJs 提交的以上传文件。这是 Dropzone 的 jQuery:

        var myDropzone = new Dropzone('#addForm',{
        paramName: "Files",clickable: id + " .dropzone-select",previewTemplate: previewTemplate,previewsContainer: id + " .dropzone-items",autoprocessQueue: false,uploadMultiple: true,parallelUploads: 100,maxFiles: 100,url: "@Url.Action("SaveSupportRequest","Request")",maxFilesize: 100,//max file size in MB,dictResponseError: 'Server not Configured',acceptedFiles: ".png,.jpg,.gif,.bmp,.jpeg,.pdf,.doc,.docx,.xls,.xlsx,gif,mpg,mpeg,.tif,.tiff,.ppt,.pptx",init: function () {
            var self = this;
            var submitButton = document.getElementById("saveRequest");
            self.options.addRemoveLinks = false;
            self.on("addedfile",function (file) {
            });

            self.on("sending",function (file) {
                console.log('upload started',file);
                $('.meter').show();
            });

            self.on("totaluploadprogress",function (progress) {
                console.log("progress ",progress);
                $('.roller').width(progress + '%');
            });

            self.on("queuecomplete",function (progress) {
                $('.meter').delay(999).slideUp(999);
            });

            self.on("removedfile",function (file) {
                console.log(file);
            });
            var submitButton = document.getElementById("saveRequest");

            submitButton.addEventListener("click",function (e) {
                e.preventDefault();
                e.stopPropagation();

                self.processQueue();
                self.options.autoprocessQueue = true;
            });

            this.on("sendingmultiple",function (data,xhr,formData) {
            });
            self.on("successmultiple",function (files,response) {

            });
        },success: function (file,response) {
                swal.fire({
                "title": "","text": "The request has been saved!","type": "success","confirmButtonClass": "btn btn-secondary","confirmButtonText": 'Close',});
            $("#ViewSupportModal").modal('toggle');
        }
    })

并且jQuery文件包含在_Layout.cshtml页面的顶部:

<script src="~/Scripts/jquery-3.3.1.min.js"></script>
<script src="~/Scripts/jquery.validate.js"></script>
<script src="~/Scripts/jquery.validate.unobtrusive.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/webfont/1.6.16/webfont.js"></script>

解决方法

暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!

如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@)