jQuery datePicker demo: limit available dates with ajax

< date picker home

The following example demonstrates how you can limit the available dates for clicking on the calendar based on the values in a dropdown.

It also demonstrates how you can add behaviour to the date picker so that when a date is rolled over the following X days are also highlighted.

This version is adapted very slightly from the original version because it demonstrates how you can load the date picker in via ajax and then instantiate it...

Click here to load the form and instantiate the behaviours...

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi turpis augue, mollis sit amet, tempus eu, hendrerit a, lorem. Nullam eget enim quis orci mollis facilisis. Mauris nisi neque, dictum ut, convallis aliquam, fringilla at, libero. Pellentesque tempor velit sit amet odio. Proin consectetur odio eu neque. Nullam est. Praesent purus sem, viverra id, pharetra id, elementum quis, leo. Vestibulum et sem. Ut interdum. Donec commodo ligula sit amet odio. Cras nulla erat, cursus at, mollis non, dapibus faucibus, quam. Curabitur lectus justo, tempus sed, mattis quis, lobortis non, urna.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec ultrices urna eu mi. Praesent eleifend, justo at mollis vestibulum, risus mi elementum quam, ut bibendum metus tellus id eros. Morbi consequat interdum nisi. In semper nisi vel risus. Nam purus purus, lobortis ut, pulvinar vel, egestas in, nisl. Duis auctor erat in risus. Cras a nisi. Nullam viverra, augue quis adipiscing pulvinar, nisi ante tincidunt nunc, eget placerat lacus mauris in odio. Sed eu justo eget orci consectetur interdum. Phasellus condimentum aliquam quam. Pellentesque sit amet ante pretium pede commodo porttitor. Pellentesque in nunc sagittis nunc pellentesque ullamcorper. Morbi ligula. Pellentesque non purus a neque porttitor aliquam. Curabitur a urna. Phasellus scelerisque, massa non sagittis varius, neque risus venenatis turpis, vitae accumsan neque sapien et elit. Sed ornare venenatis risus.

In eget ligula nec lorem lobortis auctor. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque felis massa, facilisis sit amet, cursus sed, bibendum quis, sem. Aenean facilisis nisi. Nulla pede eros, hendrerit eget, mollis aliquam, aliquet vitae, augue. Fusce vehicula. Etiam aliquam nulla eu orci. Etiam lorem. Nulla at lectus et tortor commodo lacinia. In a nulla.

Nulla sed tellus. Cras in mi eu est congue eleifend. Duis a justo. Aliquam erat volutpat. Cras interdum, risus eget ullamcorper iaculis, lorem orci aliquet sapien, id ullamcorper ligula diam volutpat purus. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; In vel libero non tellus vehicula congue. In varius nisl vitae sem. Morbi risus. Sed erat metus, egestas ac, suscipit ut, accumsan ut, lorem. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nulla odio dui, suscipit ac, gravida et, dignissim dapibus, nunc. Aenean sollicitudin nibh sit amet elit.

Proin in risus. Morbi fermentum molestie metus. Donec sed purus. Aliquam pellentesque semper dui. Sed mollis accumsan diam. Cras dictum, dolor ac ullamcorper varius, arcu sapien luctus lectus, vel semper massa mi in massa. Nam mi metus, rhoncus vel, pretium vel, tempus nec, purus. Nullam vel massa. Ut urna. Pellentesque lectus enim, ultricies a, feugiat at, fringilla id, nisl. Aliquam nibh ante, porta in, facilisis auctor, eleifend vitae, erat. Nam lorem. Quisque eget elit malesuada ligula vulputate ultrices. Aliquam erat volutpat. Vivamus ornare aliquam urna.