Verification message not working properly for datetimepicker?

Question

Here the problem is checking the datetimepicker value and reset the values ​​after the page loads.

In the check, pageload works correctly, but the datetimepickers are not reset.

After pageload having both problem values ​​does not reset, and the check does not work.

Here is the fiddle: http://jsfiddle.net/XHW3w/6/

enter code here:$("#filter-msg").kendoWindow({ modal: true, visible: false }); $("#reset").click(function () { $("#datetimepicker1").val(''); $("#datetimepicker2").val(''); }); $("#datetimepicker1").kendoDatePicker({}); $("#datetimepicker2").kendoDatePicker({}); 

Above is my code.

Answer 1

In the filter function, the value of mindate and maxdate returned as null . This is because .data() did not save the updated value from datepicker.

I updated your code to use the datepickers value as shown in the script.

http://jsfiddle.net/XHW3w/9/

 $("#filter").on("click", function () { var mindate = $('#datetimepicker1').val(); // uses the val method var maxdate = $('#datetimepicker2').val(); // uses the val method var product = $("#products").data("kendoDropDownList").value(); var order = $("#orders").data("kendoDropDownList").value(); if (!mindate || !maxdate || !product || !order) { var content = ""; if (!mindate) content += "<div class=\"k-error-colored\">mindate is not defined!</div>"; if (!maxdate) content += "<div class=\"k-error-colored\">maxdate is not defined!</div>"; if (!product) content += "<div class=\"k-error-colored\">product is not defined!</div>"; if (!order) content += "<div class=\"k-error-colored\">order is not defined!</div>"; $("#filter-msg").data("kendoWindow") .content(content) .center() .open(); return false; } });