Kendo UI Starter Template Validation

An empty fiddle with the latest Kendo UI CSS and JS references.

by Trae

HTML

<script src="http://cdn.kendostatic.com/2014.2.716/js/kendo.all.min.js"></script>
<link rel="stylesheet" href="http://cdn.kendostatic.com/2014.2.716/styles/kendo.mobile.all.min.css">
<link rel="stylesheet" href="http://cdn.kendostatic.com/2014.2.716/styles/kendo.dataviz.default.min.css">
<link rel="stylesheet" href="http://cdn.kendostatic.com/2014.2.716/styles/kendo.dataviz.min.css">
<link rel="stylesheet" href="http://cdn.kendostatic.com/2014.2.716/styles/kendo.default.min.css">
<link rel="stylesheet" href="http://cdn.kendostatic.com/2014.2.716/styles/kendo.rtl.min.css">
<link rel="stylesheet" href="http://cdn.kendostatic.com/2014.2.716/styles/kendo.common.min.css">
<div id="myForm">
    <p>
        <label for="fn" class="myLabel">First Name:</label>
        <input id="fn" name="fn" required="required" validationMessage="{0} Required" />
        <span class="k-invalid-msg" data-for="fn"></span>
    </p>
    <p>
        <label for="ln" class="myLabel">Last Name:</label>
        <input id="ln" name="ln" required="required" validationMessage="{0} Required" />
        <span class="k-invalid-msg" data-for="ln"></span>
    </p>
    <p>
        <label for="from" name="from" class="myLabel">Period:</label>
        <input id="from" name="from" required="required" validationMessage="{0} date is required" />
        <span> - </span>
        <input id="thru" name="thru"  required="required" validationMessage="{0} date is required" />
        <span class="k-invalid-msg" data-for="from"></span>
    </p>
    <p>
        <label class="myLabel"></label>
        <button id="btnSave" class="btn" >Save</button>
    </p>
</div>

JavaScript

$(document).ready(function () {
     $("#fn").kendoMaskedTextBox();
     $("#ln").kendoMaskedTextBox();
     $("#from").kendoDatePicker({format: "MM/dd/yyyy"});
     $("#thru").kendoDatePicker({ format: "MM/dd/yyyy" });
     $("#btnSave").kendoButton({ icon: "tick", click: function () {
         if (!vld.validate())
             alert(vld.errors().length);
     } });

     var vld = $("#myForm").kendoValidator().data('kendoValidator');

 })