title: Jquery Calendar and how to setup a connected booking calendar with two input fields
body: <p>When it comes to a booking calendar with a start and end-date, I think <a href="http://www.swiss.com" rel="nofollow">http://www.swiss.com</a> (choose two Airports, click on search and you will see the date fields) has the <strong>perfect</strong> execution. </p>
  
  <p>It basically works like this:
  There are two input fields for outbound flight and return flight. If you click in either one of those, two calendar pop up. One under each input field. </p>
  
  <p>They will stay open if you choose a date in the first calendar and only close if you select a date in the second calendar. </p>
  
  <p>In the mobile view - where there isn't much space - only one calendar opens and the second opens when you choose a date from the first one.</p>
  
  <p>I think this is a much better solution than having one large input field only and sort of a 3-month calendar to choose start and end, which seems to be the most used option for these kind of setups.</p>
  
  <hr>
  
  <p>I figured I'd use the Jquery Datepicker: <a href="http://keith-wood.name/datepick.HTML" rel="nofollow">http://keith-wood.name/datepick.HTML</a> as it seems it's powerful and easy to style. But I cannot find a way to keep the datepicker open and only close it when the second datepicker has a date chosen. The documentation seems not to mention it, and even with all the demos on the page, this particular problem isn't addressed.</p>
  
  <p>If someone knows a solution to mentioned setup, I'd be really glad to get some pointers. I'd also switch to another calendar plugin if there is one in which this is easy to implement. </p>