how to set date range in one date picker using datepicker ui jquery

[ramsiva]

given below my code is displaying two date pickers

  <script>
  $(function() {
    $( "#from" ).datepicker({
            minDate: -2,
      maxDate: "+1d",

      changeMonth: true,
      numberOfMonths: 2,
      onClose: function( selectedDate ) {
        $( "#to" ).datepicker( "option", "minDate", selectedDate );
      }
    });
    $( "#to" ).datepicker({
            minDate: -2,
            maxDate: "+1d",     
      changeMonth: true,
      numberOfMonths: 3,
      onClose: function( selectedDate ) {
        $( "#from" ).datepicker( "option", "maxDate", selectedDate );
      }
    });
  });
  </script>

but i neet to set and use only one date picker.

any body help me.
by using only datepicker function.
not daterangepicker.

please help me to get only one date picker to set date range using datepicker ui

[AleMonteiro]

Uhm, what you're asking seems strange to me... if you need to inputs of dates why do you want to use only one input?

Anyway, once the first date is selected you can store it in a var and clear the input to get the second date:

        var firstDate = false,
            secondDate;
        $( "#from" ).datepicker({
         minDate: -2,
          maxDate: "+1d",
          changeMonth: true,
          numberOfMonths: 2,
          onClose: function( selectedDate ) {
              if ( firstDate === false ) { // if first selection
                  firstDate = selectedDate; // store the first date
                  $("#from").val('').datepicker( "option", "minDate", selectedDate);  // set the min date of it self
              }
              // if second date...
              else {
                  secondDate = selectedDate; //
              }
          }
        });

I don't recommend, but it should work.

[AleMonteiro]

lol, could at least say what you downvoted my answer

[ramsiva]

Using Onclose and Onselect on datepicker we can do dude