Clear kendo Validation Messages when Losing focus of the element

2.9k Views Asked by At

I am applying kendo-Validation to a textbox and it seems to be working fine. The problem is when I lose focus from the textbox element the validation message still remains there and I want that message to hide when the search textbox looses focus.

Here is my Html and javascript code:

> <div class="SearchDiv" id="Search">
                @using (Html.BeginForm("Index", "Search", FormMethod.Post, new { id = "searchForm" }))
                {
                    <input type="text" id="searchText" name="searchText" class ="txtSearch", placeholder="Search", required />  
                    <button type="submit" id="btn_submit"></button>
                }
                <script>
                    $("#searchForm").kendoValidator({
                        messages: {
                            required: "Please Enter Search Text",
                        },
                        rules: {
                            required: function (input) {
                                if (input.is("[name=searchText]") && $.trim(input.val()).length == 0)
                                    return false;
                                else
                                return true;
                            }
                        },
                        validateOnBlur: false
                    });
                 </script>
        </div>
1

There are 1 best solutions below

0
On

Ok I have used the onblur attribute and applied a function there to hide my validation message whenever the search textbox looses focus.

function hideValidationMsg() {
                    $("#SearchDiv").find("span.k-tooltip-validation").hide()
                }

and my search box is defined as:

<input type="text" id="searchText" name="searchText" class ="form-control myGlobalSearch", placeholder="Assets search", required="required" onblur="hideValidationMsg()" />