jQuery UI datepicker - How to implement the ability to select two dates, from and to in 1 built-in calendar?

Question

JavaScript

There is a built-in calendar with an event on clicking on a date, it is attached to a text field:

<script type="text/javascript"><br>
$().ready(function() {<br>
<br>
$("#datepicker").datepicker({<br>
  onSelect: function(dateText, inst) { <br>
    $("#datepicker_value").val(dateText);<br>
  }<br>
});<br>
<br>
});<br>
</script><br>

<p<input type="text" value="08.07.2012" id="datepicker_value"/></p>

Task: Implement the ability to select two dates, from and to in one built-in calendar, with highlighting of 1 field and 2 fields.
Those. so that after selecting 1 date "from", it was possible to select the date "to". And both values ​​were entered into different text fields.
It is necessary to implement it through the datepicker.

Secondary tasks: When you select 1 date, field 2 of the date automatically takes the value +1w

Implementation example here: avia.onlinetur.ru/
Search for flights, fields there and back.

Answer 1

Take a look at this example:
multidatespickr.sourceforge.net

Answer 2

Well, it is necessary to expand the datapicker, it does not know how to do this out of the box. The functionality is described here . There's a link there, but right now it's throwing an error.

Answer 3

The site from the example did not open for me. So like jsfiddle.net/BJEYe/ ?

Answer 4

Hmm, what's stopping you from taking advantage of the events provided by jquery's calendar itself? Write a valid onSelect handler to insert the date into the second field