Opened 11 years ago

Closed 11 years ago

#6917 closed bug (wontfix)

Datepicker min/maxDate don't prevent typing in dates outside this range

Reported by: WetCoast Owned by:
Priority: minor Milestone: 1.9.0
Component: ui.datepicker Version: 1.8.9
Keywords: Cc:
Blocked by: Blocking:

Description

While setting minDate and maxDate restricts selecting a date from the datepicker popup calendar, the user can still type a date outside this range into the text field and then tab to the next field, leaving the date outside the range in the text field.

Here is some reduced code demonstrating this. The date should be restricted to between 1/1/1990 and 12/31/1999, but when the calendar pops up, you can still type 1/1/1700 into the field and tab to the next, leaving the date in place even though it is outside the expected range.

http://jsbin.com/ojumi5

<!DOCTYPE html>
<html>
<head>
   <meta charset="UTF-8">
   <link type="text/css" rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.9/themes/sunny/jquery-ui.css" />
   <script type="text/javascript" src="http://code.jquery.com/jquery-1.4.4.min.js"></script>
   <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.9/jquery-ui.min.js"></script>
   <script type="text/javascript">
$(document).ready(function() {
   $('.date').datepicker({
      changeMonth: true,
      changeYear: true,
      dateFormat: 'mm/dd/yy',
      minDate: new Date(1990, 0, 1),
      maxDate: new Date(1999, 11, 31)
   });
});
   </script>
</head>
<body>
   <form>
      <div>
         <label for="mydate">Date</label>
         <input type="text" name="mydate" id="mydate" maxlength="12" class="date">
      </div>
      <div>
         <label for="next">Next</label>
         <input type="text" name="next" id="next" maxlength="12">
      </div>
   </form>
</body>
</html>

Change History (1)

comment:1 Changed 11 years ago by Scott González

Resolution: wontfix
Status: newclosed

The datepicker widget is only designed to restrict dates within the calendar. If you want to prevent users from manually typing in an invalid date, you should use the validation plugin or make the text field readonly.

Note: See TracTickets for help on using tickets.