Datepicker: Fix date range demo when entering values manually

Fixes #11143
Closes gh-1454

diff --git a/demos/datepicker/date-range.html b/demos/datepicker/date-range.html
index 34c64a9b2e026ee40f5e7d4790432fcca2f0b1ba..8d606969cca82bc8fc4c09d0d3337d6b2464daba 100644 (file)
--- a/demos/datepicker/date-range.html
+++ b/demos/datepicker/date-range.html
@@ -11,22 +11,35 @@
        <link rel="stylesheet" href="../demos.css">
        <script>
        $(function() {
-               $( "#from" ).datepicker({
-                       defaultDate: "+1w",
-                       changeMonth: true,
-                       numberOfMonths: 3,
-                       onClose: function( selectedDate ) {
-                               $( "#to" ).datepicker( "option", "minDate", selectedDate );
-                       }
-               });
-               $( "#to" ).datepicker({
-                       defaultDate: "+1w",
-                       changeMonth: true,
-                       numberOfMonths: 3,
-                       onClose: function( selectedDate ) {
-                               $( "#from" ).datepicker( "option", "maxDate", selectedDate );
+               var dateFormat = "mm/dd/yy",
+                       from = $( "#from" )
+                               .datepicker({
+                                       defaultDate: "+1w",
+                                       changeMonth: true,
+                                       numberOfMonths: 3
+                               })
+                               .on( "change", function() {
+                                       to.datepicker( "option", "minDate", getDate( this ) );
+                               }),
+                       to = $( "#to" ).datepicker({
+                               defaultDate: "+1w",
+                               changeMonth: true,
+                               numberOfMonths: 3
+                       })
+                       .on( "change", function() {
+                               from.datepicker( "option", "maxDate", getDate( this ) );
+                       });
+
+               function getDate( element ) {
+                       var date;
+                       try {
+                               date = $.datepicker.parseDate( dateFormat, element.value );
+                       } catch( error ) {
+                               date = null;
                        }
-               });
+
+                       return date;
+               }
        });
        </script>
 </head>