Thursday, July 18, 2013

JQuery UI - Date Range Selection

I spent the last few days playing around with changes to make the DatePicker in JQuery work a little more like a range selection tool.

I initially expected this to be a simple extension to JQuery UI's widget structure, but datepicker seems to be a variant and relies upon an instanced configuration. So, it took a bit more work than I originally anticipated.

There was a couple of posts on this, but nothing with a gist or fiddle project to actually learn from - so I've added a fiddle for anyone who would like to see it in action. Hopefully, it will assist anyone what wants a Hotel or Airport style date range selection tool using an existing datepicker configuration.

It's modified from it's base form a bit.. so you'll have to overlook the hacks in there (These were added to support some external requirements to the original design).


Hope it helps in building your little slice of heaven.

http://jsfiddle.net/dacrazycoder/4Fppd/

No comments:

Post a Comment