Question

I am trying to setup two date pickers like this http://jqueryui.com/demos/datepicker/#date-range. But if you manually type in a date into that example you can break the code. e.g. select a from date, then the picker stops you from selecting a date before the from date, but you can manually type in a to date that is earlier.

I have set up the example here http://jsfiddle.net/Ruhley/s3h5L/

Answer 1

1. first idea
   • use the beforeShow instead of onSelect to set the max/min date range. You still can enter manually wrong values, but as soon as you try to open a datepicker it will auto correct itself.
   • to avoid manual tampering, you can make readonly the fields.
2. second idea
   • use the beforeShow and at the same time do some manual checking at the change event of the fields. ( http://jsfiddle.net/s3h5L/4/ )