【问题标题】:required field - validation doesn't display in bootstrap modal popup MVC必填字段 - 验证不会显示在引导模式弹出 MVC 中
【发布时间】:2016-08-10 06:10:18
【问题描述】:

我想在我的网站中添加产品。当我单击创建产品时,我必须输入一些值。当尝试在没有任何数据的情况下保存时,您需要检查验证工作。它可以工作,但是当我单击提交时,表单不在模式弹出窗口(image2)中 - 它像其他网站一样显示

我想要这个 (image1) - 在模式弹出窗口中显示

以红色突出显示的验证是波兰语,但这意味着这些字段是必需的。

我使用 formData 因为我必须发送一个文件。

modalform.js

var formdata = new FormData($('form').get(0));
    $('form', dialog).submit(function () {
        $.ajax({
            url: this.action,
            type: this.method,
            data: formdata,
            success: function (result) {
                if (result.success) {
                    $('#myModal').modal('hide');
                } else {
                    $('#myModalContent').html(result);
                    bindForm();
                }
            }
        });
        return false;
    });

我正在使用 AJAX 发布来提交表单中的数据。使用 $(this).serialize() 时,将调用 ajax 成功,但文件未返回,因为内容类型不同。我怎样才能改变这个??

型号

public partial class Produkty
    {
        public int PRO_Id { get; set; }
        public string PRO_Nazwa { get; set; }
        public string PRO_Jednostka { get; set; }
        public float PRO_Vat { get; set; }
        public string PRO_Rodzaj { get; set; }
        public string PRO_Opis { get; set; }
        public string PRO_Waluta { get; set; }
        public float PRO_CenaN { get; set; }
        public float PRO_CenaB { get; set; }
        public string PRO_ZdjecieN { get; set; }
        public byte[] PRO_ZdjecieF { get; set; }
    }

创建视图

@using (Html.BeginForm("Create", "Products", FormMethod.Post, new { enctype = "multipart/form-data" }))
//@using (Html.BeginForm())
{
    @Html.AntiForgeryToken()

    <div class="modal-body">

        <div class="form-horizontal">
            @Html.ValidationSummary(true, "", new { @class = "text-danger" })

            <div class="form-group">
                @Html.LabelFor(model => model.PRO_Nazwa, "Nazwa", htmlAttributes: new { @class = "control-label col-md-3" })
                <div class="col-md-9">
                    @Html.EditorFor(model => model.PRO_Nazwa, new { htmlAttributes = new { @class = "form-control" } })
                    @Html.ValidationMessageFor(model => model.PRO_Nazwa, "", new { @class = "text-danger" })
                </div>
            </div>

            <div class="form-group">
                @Html.LabelFor(model => model.PRO_Jednostka, "Jednostka", htmlAttributes: new { @class = "control-label col-md-3" })
                <div class="col-md-9">
                    @Html.EditorFor(model => model.PRO_Jednostka, new { htmlAttributes = new { @class = "form-control", @Value = "szt." } })
                    @Html.ValidationMessageFor(model => model.PRO_Jednostka, "", new { @class = "text-danger" })
                </div>
            </div>

            <div class="form-group">
                @Html.LabelFor(model => model.PRO_Vat, "Vat", htmlAttributes: new { @class = "control-label col-md-3" })
                <div class="col-md-9">
                    @Html.DropDownListFor(model => model.PRO_Vat, new List<SelectListItem>
                    {
                        new SelectListItem{ Text = "23 %", Value = "23"},
                        new SelectListItem{ Text = "8 %", Value = "8" },
                        new SelectListItem{ Text = "5 %", Value = "5" },
                        new SelectListItem{ Text = "4 %", Value = "4" },
                        new SelectListItem{ Text = "0 %", Value = "0" }

                    }, "wybierz...", new { @class = "form-control", @id = "Value1" })
                    @Html.ValidationMessageFor(model => model.PRO_Vat, "", new { @class = "text-danger" })
                </div>
            </div>

            <div class="form-group">
                @Html.LabelFor(model => model.PRO_Rodzaj, "Rodzaj", htmlAttributes: new { @class = "control-label col-md-3" })
                <div class="col-md-9">
                    @Html.DropDownListFor(model => model.PRO_Rodzaj, new List<SelectListItem>
                    {
                        new SelectListItem{ Text = "towar", Value = "towar" },
                        new SelectListItem{ Text = "usługa", Value = "usługa" }

                    }, "wybierz...", new { @class = "form-control" })
                    @Html.ValidationMessageFor(model => model.PRO_Rodzaj, "", new { @class = "text-danger" })
                </div>
            </div>

            <div class="form-group">
                @Html.LabelFor(model => model.PRO_Waluta, "Waluta", htmlAttributes: new { @class = "control-label col-md-3" })
                <div class="col-md-9">
                    @Html.DropDownListFor(model => model.PRO_Waluta, new List<SelectListItem>
                    {
                        new SelectListItem{ Text = "PLN", Value = "PLN" },
                        new SelectListItem{ Text = "EUR", Value = "EUR" },
                        new SelectListItem{ Text = "USD", Value = "USD" },
                        new SelectListItem{ Text = "GBP", Value = "GBP" },
                        new SelectListItem{ Text = "CHF", Value = "CHF" }

                    }, "wybierz...", new { @class = "form-control" })
                    @Html.ValidationMessageFor(model => model.PRO_Waluta, "", new { @class = "text-danger" })
                </div>
            </div>


            <div class="form-group">
                @Html.LabelFor(model => model.PRO_CenaN, "Cena netto", htmlAttributes: new { @class = "control-label col-md-3" })
                <div class="col-md-9">
                    @Html.EditorFor(model => model.PRO_CenaN, new { htmlAttributes = new { @class = "form-control", @id = "Value2" } })
                    @Html.ValidationMessageFor(model => model.PRO_CenaN, "", new { @class = "text-danger" })
                </div>
            </div>

            <div class="form-group">
                @Html.LabelFor(model => model.PRO_CenaB, "Cena brutto", htmlAttributes: new { @class = "control-label col-md-3" })
                <div class="col-md-9">
                    @Html.EditorFor(model => model.PRO_CenaB, new { htmlAttributes = new { @class = "form-control", @id = "MultiplyValue1Value2" } })
                    @Html.ValidationMessageFor(model => model.PRO_CenaB, "", new { @class = "text-danger" })
                </div>
            </div>

            <div class="form-group">
                @Html.LabelFor(model => model.PRO_Opis, "Opis", htmlAttributes: new { @class = "control-label col-md-3" })
                <div class="col-md-9">
                    @Html.EditorFor(model => model.PRO_Opis, new { htmlAttributes = new { @class = "form-control", @Value = "brak" } })
                    @Html.ValidationMessageFor(model => model.PRO_Opis, "", new { @class = "text-danger" })
                </div>
            </div>

            <div class="form-group">
                @Html.LabelFor(model => model.PRO_ZdjecieF, "Plik", htmlAttributes: new { @class = "control-label col-md-3" })
                <div class="col-md-9">
                    <input type="file" id="file" class ="btn btn-default btn-file" name="file" />
                    @Html.ValidationMessageFor(model => model.PRO_ZdjecieF, "", new { @class = "text-danger" })
                </div>
            </div>

        </div>

    </div>

    <div class="modal-footer">
        <button class="btn" data-dismiss="modal">Anuluj</button>
        <input class="btn btn-primary" id="upload" type="submit" value="Zapisz" />
    </div>

控制器:

[HttpPost]
        [AcceptVerbs(HttpVerbs.Post)]
        [ValidateAntiForgeryToken]
        public ActionResult Create([Bind(Exclude = "PRO_ZdjecieF,PRO_Zdjecie")]Produkty pro, HttpPostedFileBase file)
        {           


            if (ModelState.IsValid)
            {
                //if (imageF != null)
                {
                    pro.PRO_ZdjecieF = new byte[file.ContentLength];
                    pro.PRO_ZdjecieN = file.ContentType;
                    file.InputStream.Read(pro.PRO_ZdjecieF, 0, file.ContentLength);
                }

                db.Produkties.Add(pro);
                db.SaveChanges();
                return Json(new { success = true });
            }

            return PartialView("Create", pro);
        }

请帮忙解决这个问题。

【问题讨论】:

    标签: jquery ajax asp.net-mvc twitter-bootstrap


    【解决方案1】:

    在模型类中添加验证

    public partial class Produkty
        {
            [Required(ErrorMessage = "*")]
    
            public int PRO_Id { get; set; }
            [Required(ErrorMessage = "*")]
    
            public string PRO_Nazwa { get; set; }
            public string PRO_Jednostka { get; set; }
            public float PRO_Vat { get; set; }
            public string PRO_Rodzaj { get; set; }
            public string PRO_Opis { get; set; }
            public string PRO_Waluta { get; set; }
            public float PRO_CenaN { get; set; }
            public float PRO_CenaB { get; set; }
            public string PRO_ZdjecieN { get; set; }
            public byte[] PRO_ZdjecieF { get; set; }
        }
    

    在您的视图页面中添加此代码

       $('#form1').removeData('validator');
       $('#form1').removeData('unobtrusiveValidation');
       $.validator.unobtrusive.parse('#form1');
    

    【讨论】:

    • 工作 :) 谢谢。如果该条目已存在于数据库中,我如何验证(在同一个模式弹出窗口中)?
    • 你想在弹出窗口中做什么样的验证?
    • 如果数据酶中存在 PRO_Nazwa 字段,则与 image1 中的相同
    • 图片看不到,被屏蔽了
    猜你喜欢
    • 2017-11-24
    • 2012-05-11
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2021-11-01
    • 2016-01-20
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多