简体   繁体   中英

jquery validation not showing error message

This is my script code when I am running this code it is not showing any message it only showing red texbox for required field but i want to show error message below text box

(function ($, W, D) {
    var JQUERY4U = {};

    JQUERY4U.UTIL =
    {
        setupFormValidation: function () {
            $("#register-form").validate({
                rules: {
                    FirstName: "required",
                    LastName: "required",
                },
                messages: {
                    FirstName: "Please enter your firstname",
                    LastName: "Please enter your lastname",
                },
                submitHandler: function (form) {
                    form.submit();
                }
            });
        }
    }
    $(D).ready(function ($) {
        JQUERY4U.UTIL.setupFormValidation();
    });

})(jQuery, window, document);

this is my view code

<form action="" method="post" id="register-form" novalidate="novalidate">
    <div class="col-md-6">
        <div class="panel panel-default nobottommargin">
            <div class="panel-body" style="padding: 40px;">
                <div class="heading-block fancy-title nobottomborder title-bottom-border">
                    <h4>Registration</h4>
                </div>
                @using (Html.BeginForm("Registration", "Account"))
                                            {
                    @Html.AntiForgeryToken()

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

                        <div class="form-group">
                            @Html.LabelFor(model => model.FirstName, htmlAttributes: new { @class = "control-label col-md-4" })
                            <div class="col-md-8">
                                @Html.EditorFor(model => model.FirstName, new { htmlAttributes = new { @class = "form-control" } })

                                @Html.ValidationMessageFor(model => model.FirstName, "", new { @class = "text-danger" })
                            </div>
                        </div>
                        <div class="form-group">
                            @Html.LabelFor(model => model.LastName, htmlAttributes: new { @class = "control-label col-md-4" })
                            <div class="col-md-8">
 //this is model binding in mvc                                                               
                                @Html.EditorFor(model => model.LastName, new { htmlAttributes = new { @class = "form-control" } })

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

Inside your View use

@Scripts.Render("~/bundles/jqueryval")

This will reference the jquery.validate javascript that will handle the client side validation.

In you Model class use the attribute for your class properties.属性用于您的类属性。

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

Then inside your Return the model if the ModelState is not valid/does not match your requirements.内部返回模型。

if (!ModelState.IsValid)
{
     return View(model);
}

showing only red text box not message

That's because you've told it to only show custom errors and not to show property errors

Change

@Html.ValidationSummary(true, "", new { @class = "text-danger" })

to

@Html.ValidationSummary(false, "", new { @class = "text-danger" })

then you'll get the property errors in the summary box as well as in the @Html.ValidationMessageFor - so you should remove those

However

If you're not getting property errors in @Html.ValidationMessageFor either, then you've not wired up your validation for use with these two MVC helpers - you're expecting these to do something they don't do.

All validation should be both client-side and server-side. By applying server side attributes ( [Required] on the viewmodel) and using unobtrusive.js, you'll get both automatically, without needing to write everything twice.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM