Skip welcome & menu and move to editor
Welcome to JS Bin
File
Add library
Share
Login or Register
Blog
Help
Load cached copy from
  • Run with JS
  • Save
  • Share
  • …
 
<!DOCTYPE html>
<html>
<head>
<link href="http://cdn.kendostatic.com/2013.3.1119/styles/kendo.common.min.css" rel="stylesheet" type="text/css" />
<link href="http://cdn.kendostatic.com/2013.3.1119/styles/kendo.rtl.min.css" rel="stylesheet" type="text/css" />
<link href="http://cdn.kendostatic.com/2013.3.1119/styles/kendo.default.min.css" rel="stylesheet" type="text/css" />
<link href="http://cdn.kendostatic.com/2013.3.1119/styles/kendo.dataviz.min.css" rel="stylesheet" type="text/css" />
<link href="http://cdn.kendostatic.com/2013.3.1119/styles/kendo.dataviz.default.min.css" rel="stylesheet" type="text/css" />
<link href="http://cdn.kendostatic.com/2013.3.1119/styles/kendo.mobile.all.min.css" rel="stylesheet" type="text/css" />
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="http://cdn.kendostatic.com/2013.3.1119/js/kendo.all.min.js"></script>
​
</head>
  
<body>
  
  <form>
    <input id="datepicker" required>
    <input type="submit">
  </form>
  
</body>
</html>
 
$("#datepicker").kendoDatePicker();
​
​
$("form").kendoValidator({
  rules: {
    dateValidation: function(element) {
      var value = $(element).val();
      
      var date = kendo.parseDate(value);
      if (!date) {
        return false;
      }
      
      return true;
    },
    minDate: function(element) {
      var value = $(element).val();
      
      var date = kendo.parseDate(value);
      
      var result = date >= new Date();
      
      return result;
    }
  },
  messages: {
    dateValidation: "You must enter a date",
    minDate: "The date must not be in the past"
  }
});
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
anonymouspro
0viewers