0

I have two datepicker fields with preselected dates, what I need to do is when user select any new date in the first datepicker then I need to change the default value of the second datepicker to adding 10 days to newly selected date of first date picker without changing the actual value of second datepicker. Right now I am reinitializing the second datepicker and setting the default value by "defaultDate" option.

$('#x').datepicker( 'destroy' );
$('#x').datepicker({
  defaultDate : "03/21/2020"
});

code suggested

let dateFromPicker1 = $("#picker1").val();
let dt = new Date(dateFromPicker1 );
dt.setDate(dt.getDate()+10);
$('#picker2').datepicker( 'destroy' );
$('#picker2').datepicker({
  defaultDate : dt
});

but this is not working because datepicker already have some value so i m not able to change its default value.

Please Someone, solve my issue. If anyone wants any other information please let me know.

Any help would be greatly appreciated.

Rahul Saini
  • 111
  • 2
  • 11
  • 1
    There is a function to set a new Date (`setDate`). So you can simply calculate your desired date an pass it: `$("#x").datepicker("setDate", yourCalculatedDate);` – KHansen Feb 21 '20 at 09:20
  • @KHansen actually I only want to change the Default date like the selected date in the popup calendar. I don't want to change the value of datepicker. – Rahul Saini Feb 21 '20 at 09:43
  • I know it is often hard to find the right search terms, but even searching for just "two datepickers" turns up so many similar questions here on SO that help. [Here's one doing *exactly* what you are asking](https://stackoverflow.com/questions/7598710/jquery-datepicker-defaultdate-dynamically-from-another-datepicker). – Don't Panic Feb 21 '20 at 10:21
  • Does this answer your question? [jQuery datepicker - defaultDate (dynamically) from another datepicker](https://stackoverflow.com/questions/7598710/jquery-datepicker-defaultdate-dynamically-from-another-datepicker) – Don't Panic Feb 21 '20 at 10:21
  • @Don'tPanic, the answer is shared will not work in my condition because both in my case both datepicker fields already have selected date, now on changing the value of the first datepicker I need to change default value of second datepicker(not set value) . – Rahul Saini Feb 21 '20 at 10:57
  • 1
    C'mon, try harder! :-) If the standard way to set a default date doesn't work bcs the datepicker has a value, then surely the next question is [*How do I clear/reset the selected dates on the jQuery UI Datepicker calendar?*](https://stackoverflow.com/questions/9435086/how-do-i-clear-reset-the-selected-dates-on-the-jquery-ui-datepicker-calendar) Seriously, there are no new jQuery questions, just search and you'll find the answer to whatever you're trying to do. [Here's a modified JSFiddle](https://jsfiddle.net/dont_panic/w2fLbsop/) from the first question I linked to doing what you need. – Don't Panic Feb 21 '20 at 11:37
  • @Don'tPanic, yes man I m trying only. In a modified answer, you are clearing the actual value of picker2 and then setting up the default value of picker2 but in my case, I want to change the default value of picker2 without clearing the actual value of picker2. – Rahul Saini Feb 24 '20 at 06:49
  • So, think about it. 1) get current value of picker2; 2) clear value of picker2; 3) set default value of picker2; 4) set picker2 value back to the value you found in 1; – Don't Panic Feb 24 '20 at 09:58
  • @Don'tPanic, I already tried this. When I did "set picker2 value back to the value you found in 1", the default value of picker2 again changed to the actual value of picker2. – Rahul Saini Feb 24 '20 at 11:09

1 Answers1

0

Get the date selected on first date picker and create a new Date object and increment the date with 10 and set it to second datepicker default.

let dateFromPicker1 = <pick date from picker1>
let dt = new Date(dateFromPicker1 );
dt.setDate(dt.getDate()+10);

now set dt to picker2 default

Basit
  • 862
  • 1
  • 12
  • 30
  • setDate changes the value of datepicker. I need to change only the selected date in the popup calendar. – Rahul Saini Feb 21 '20 at 09:46
  • No setDate change the value of dt variable only, isn't it? – Basit Feb 21 '20 at 09:47
  • I changed my code to what you suggested (added in question), but no change . please me know if I m something wrong – Rahul Saini Feb 21 '20 at 10:20
  • This is the simplest solution you can use, i don't know where you are doing wrong. Share your complete code this may help – Basit Feb 21 '20 at 10:38
  • the problem is the second datepicker already has some date that's why on changing the date of the first datepicker I m not able to change the default date of the second datepicker. – Rahul Saini Feb 21 '20 at 11:16
  • You need to destroy picker2 and initialize again with new date as $('#picker2').datepicker( 'destroy' ); $('#picker2').datepicker({ defaultDate : dt <-- new date }); – Basit Feb 21 '20 at 11:18
  • What exactly the problem? Is the new default value not setting on picker2 – Basit Feb 21 '20 at 12:01
  • yes, new default value not setting on picker2 (i need in calendar popup value only not the actual value of picker2). – Rahul Saini Feb 24 '20 at 06:44