This is a migrated thread and some comments may be shown as answers.

Kendo Validation Client Validation on IE 9

4 Answers 33 Views
General Discussions
This is a migrated thread and some comments may be shown as answers.
Kenneth
Top achievements
Rank 1
Kenneth asked on 03 Sep 2013, 08:15 PM
Hi,

We are using Kendo Controls for MVC (kendo UI Version 2013.1.514)  in our project and we have some cross browser compatibility issue.

Specifically, the Kendo client side validations (unobstrusive) does not work as expected in IE 9. Usually when you focus a required field control (textbox for instance) and move to the next control without entering data, the unobstrusive validation triggers  and shows the message. The same is true when you directly hit submit without entering any required fields.

The application works fine in Chrome and Firefox but it does not work in IE 9.
This is how we are triggering validate function.  
$(document).ready(function () {
      var form = $("form");
      var validator = form.kendoValidator().data("kendoValidator");      
      $("#btnSubmit").click(function () {
          if (validator.validate()) {
              form.submit();
          }
      });
  });
View Model Binding
@using (Html.BeginForm())
{
    @Html.ValidationSummary(true)
 
                @Html.LabelFor(model => model.CompanyName)
                <span>
                    @Html.EditorFor(model => model.CompanyName)
                    @Html.ValidationMessageFor(model => model.CompanyName)
                </span>
--- omitted for brevity
<p>
             <input id="btnSubmit" type="submit" value="Add Customer" />
        </p>
}
Attached other files for support.

Any help is highly appreciated. Thanks.

4 Answers, 1 is accepted

Sort by
0
Kenneth
Top achievements
Rank 1
answered on 04 Sep 2013, 11:39 AM
Anyone from the product team?
0
Kiril Nikolov
Telerik team
answered on 05 Sep 2013, 08:52 AM
Hi Kenneth,

I have already answered the other support request that you have opened. I have tested the Kendo UI Validator inside IE 8 and IE9 (in IE8 mode) but the validation message seem to be shown correctly. Please check this demos for further reference:

http://demos.kendoui.com/web/validator/index.html

This is why I would like to ask you to extract a runnable sample representing the problem.
 
Regards,
Kiril Nikolov
Telerik
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
Nirman
Top achievements
Rank 1
answered on 13 Nov 2013, 04:04 PM
this occurs when you use a control/widget like the autocomplete that utilizes the placeholder attribute in IE 9. 

Since browsers below IE 10 do not natively support the placeholder attribute, the controls inserts a placeholder value for empty values, however this causes the validator to incorrectly evaluate the value for required validations.  

What it should do is check for an empty string or if the value equates to the placeholder value.  

<input name="locality" value="" validationMessage="Locality is required" required="required" placeholder="Required" />
$("[name=locality]").kendoAutocomplete({
        dataSource:  {
               transport: {
                read: {
                  url: "http://domain.com/path/to/locality-service"
                }
               }
           }
});
 
// elsewhere
 
var validator = $("#container").kendoValidator().data("kendoValidator");
 
$("button:Contains(save)").click(function(e) {
       if(!validator.validate()) {
                e.stopPropagation();
                e.preventDefault();
                return false;
       }
 
      // otherwise save or do something else.
});
0
Alexander Valchev
Telerik team
answered on 15 Nov 2013, 04:32 PM
Hi Michael,

This is a known limitation. As a possible solution I can suggest you to create a custom validation rule which checks whether the input's value is equal to the placeholder text. Alternatively you may disable the placeholder option.

Regards,
Alexander Valchev
Telerik
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Tags
General Discussions
Asked by
Kenneth
Top achievements
Rank 1
Answers by
Kenneth
Top achievements
Rank 1
Kiril Nikolov
Telerik team
Nirman
Top achievements
Rank 1
Alexander Valchev
Telerik team
Share this question
or