DatePicker focus() problem

Ask the community
, ,
1

Hi,
I create a form that contains two datepickers - one for check-in and the other for check-out.
I want that after selecting the check-in date, the check-out datepicker calendar will open automatically.
To do this I use focus (), but its just put the cursor there, without openning the calendar.

(There are other several functions, I don’t think it makes any difference for the focus() function, but I post my whole code).

//when checkin date selected
export function checkIn_change(event) {
    $w('#datePicker2').enable(); //enable the checkout datepicker (which is disabled at startup)
 let checkinDate = $w('#datePicker1').value; //store the checkin date
    setCheckOutMinDate(checkinDate); //set the checkout minimum date to be one day after the checkin date

  //if the checkin date is changed to a date after the selected checkout date (which is not possible):
 if (($w('#datePicker2').value) && ($w('#datePicker2').value <= $w('#datePicker1').value)) {
        setCheckOutValue(checkinDate); //change the checkout date to be one day after the checkin date
    }
    $w('#datePicker2').focus(); //THE PROBLEM: SHOULD OPEN THE CALENDAR, BUT JUST PUT THE CURSOR
 
}
//function to set the checkout minimum date to be one day after the checkin date
function setCheckOutMinDate(checkin) {
 let nextDay = new Date (checkin);
    nextDay.setDate(nextDay.getDate() + 1);
    $w('#datePicker2').minDate = nextDay;
}

//function to change the checkout date to be one day after the checkin date
function setCheckOutValue(checkin) {
 let nextDayVal = new Date (checkin);
    nextDayVal.setDate(nextDayVal.getDate() + 1);
    $w('#datePicker2').value = nextDayVal;
}

Thank you