Weird behaviour: Validation message does not show depending on HTML structure

[Karim]

Using this Code:

<div id="myform">

<ul>

<li>name <input name="ctl00$MainContent$tbName" id="MainContent_tbName" style="width: 100px;" type="text" required validationmessage="fill in name"/></li>

<li>firstName <input type="text" name="firstName" required validationMessage="fill in firstName" /></li>

<li>lastName <input type="text" name="lastName" required validationMessage="fill in lastName" /></li>

</ul>

<button id="save" type="button">

Save</button>

</div>

<script type="text/javascript">

$(document).ready(function () {

var validator = $("#myform").kendoValidator().data("kendoValidator");

$("#save").click(function () {

if (validator.validate()) {

alert('juhu');

}

});

});

</script>

Validation works almost fine. All three messages are shown when hitting the save button. Hitting the save button for the second time the first message disappears.

I changed the code as follow (switching input text 1 and 2):

<ul>                       

            <li>firstName <input type="text" name="firstName" required validationMessage="fill in firstName" /></li>           

            <li>name <input name="ctl00$MainContent$tbName"  id="MainContent_tbName" style="width: 100px;" type="text" required validationmessage="fill in name"/></li>

            <li>lastName <input type="text" name="lastName" required validationMessage="fill in lastName" /></li>

        </ul>

Now only the first and third message is shown. When I hit the save button for the second time the first message disappears also.

The page is build from an ASP.NET 4.0 Webforms project using MasterPages. The "name input" is generated aspx => html code pasted manually in this page.

[Rosen]

Hello Karim,

The behavior you have described is caused by the special characters in the name of the input. However, we have managed to address it and I have attached an internal build of kendo.all.min.js for you to try.

Regards,
Rosen
the Telerik team

[Karim]

Hello Rosen,

thank you for the quick reply. I tried the new file but I get a JScript runtime error stating that the property or method called "kendoValidator" does not exist. I don't know the exact english translation because the error message is in german.

The error is caused by the following line:

 var validator = $("#myform").kendoValidator().data("kendoValidator"); 

Could it be that the validation api is not included?

Regards,
Karim

[Rosen]

Hi,

Could you verify that the file is included correctly on the page and there are not other JavaScript errors or failed HTTP requests.

Regards,
Rosen
the Telerik team

[Karim]

Hi,

how awkward, I got a '~/' in the beginning of the script path...
The validation works fine now :)
Thank you very much!

merry x-mas and a happy new year
Karim