Kendo UI form Validation

1.5k
0
0

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Kendo UI Snippet</title>
<link rel="stylesheet" href="http://kendo.cdn.telerik.com/2015.3.1111/styles/kendo.common.min.css" />
<link rel="stylesheet" href="http://kendo.cdn.telerik.com/2015.3.1111/styles/kendo.rtl.min.css" />
<link rel="stylesheet" href="http://kendo.cdn.telerik.com/2015.3.1111/styles/kendo.silver.min.css" />
<link rel="stylesheet" href="http://kendo.cdn.telerik.com/2015.3.1111/styles/kendo.mobile.all.min.css" />
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="http://kendo.cdn.telerik.com/2015.3.1111/js/kendo.all.min.js"></script>
</head>
<body>
<form id="myform">
<div class="form-inline k-alt">
<span class="editPageLabel">FirstName:<span style="color:red">*</span></span>
<input name="FirstName" required validationmessage="Please Enter First Name"/> <br />
</div>
<div class="form-inline k-alt">
<span class="editPageLabel">LastName:<span style="color:red">*</span></span>
<input name="LastName" required validationmessage="Please Enter Last Name"/> <br />
</div>
<div class="form-inline k-alt">
<span class="editPageLabel">Email:<span style="color:red">*</span></span>
<input type="email" required validationmessage="Please Enter Proper Email ID" /><br />
<button id="Btn-Validation" onclick="Validation()">Validate</button>
</div>
</form>
<script>
$(document).ready(function(){
var validator = $("#myform").kendoValidator().data("kendoValidator");
$("#myform").on("submit", function () {
alert("Successful submission");
});
})
</script>
</body>
</html>