Clear validation messages client side

2 posts, 0 answers
  1. rina
    rina avatar
    7 posts
    Member since:
    Mar 2019

    Posted 23 Sep Link to this post

    Hi,

    I have a form in a modal window with server-side validation. "Name" field is a required input as defined by my model.

    @using (Html.BeginForm("chnage", "Home", FormMethod.Post, new { id = "changeform" }))
    {
        @Html.AntiForgeryToken()
        @Html.ValidationSummary("", new { @class = "text-danger" })
        <div class="modal fade-scale" id="changemodal" tabindex="-1" role="dialog">
            <div class="modal-dialog" role="document">
                <div class="modal-content">
                    <div class="modal-header text-center">
                        <h4 class="modal-title w-100">Change</h4>
                    </div>
                    <div class="modal-body" id="modalFormBody">
                        <div class="container">
                            <div class="row">
                                <label class="col-sm-2 col-form-label">Name</label>
                                <div class="col-6">
                                    @Html.EditorFor(model => model.Name, new { htmlAttributes = new { @class = "form-control", @style = "width:50px" } })
                                    @Html.ValidationMessageFor(model => model.Name)
                                </div>
                            </div>
                            <div class="row">
                                <label class="col-sm-2 col-form-label">Info</label>
                                <div class="col-6">
                                    @Html.EditorFor(model => model.Info, new { htmlAttributes = new { @class = "form-control", @style = "width:50px" } })
                                    @Html.ValidationMessageFor(model => model.Info)
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="modal-footer justify-content-center">
                        <button type="submit" id="submit" name="submit" value="submit" class="btn k-primary k-button">Switch</button>
                        <button type="submit" id="clearBtn" name="submit" value="clear" class="btn k-button" onclick="this.form.reset();">Clear</button>
                        <button type="submit" id="closeBtn" name="submit" value="close" class="btn k-button" data-dismiss="modal">Close</button>
                    </div>
                </div>
            </div>
        </div>
    }

     

    I need to be able to clear the validation messages on for eg. modal window close or a clear button.

    <span class="k-widget k-tooltip k-tooltip-validation k-invalid-msg field-validation-error" id="Name_validationMessage" role="alert" data-valmsg-for="Name" data-for="Name"><span class="k-icon k-i-warning"> </span> Name is required</span>

     

    How can I get the error messages cleared out? 

    Thanks a lot

     

  2. Alex Hajigeorgieva
    Admin
    Alex Hajigeorgieva avatar
    773 posts

    Posted 24 Sep Link to this post

    Hi, Irina,

    The Kendo UI Validator would hide the messages once the input becomes valid out of the box.

    However, to hide the messages programmatically, you can get the Kendo UI Validator instance and call the hideMessages() method:

    https://docs.telerik.com/kendo-ui/api/javascript/ui/validator/methods/hidemessages

    Let us know in case you have further questions.

    Kind Regards,
    Alex Hajigeorgieva
    Progress Telerik

    Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
Back to Top