Clear validation messages client side

[Irina]

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

 

[Alex Hajigeorgieva]

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