Vorbly <Code>
CODING MADE EASY WITH VORBLY
WIX PASS DATE BETWEEN TWO DATEPICKERS
Starting a booking website? This tutorial will show you how to pass dates from one Wix Datepicker to another. And using that information, we will set the minimum date for the second datepicker. We will provide you with the webpage elements and sample codes required to implement this feature.
THE DEMO
Add two Wix Datepickers to your webpage. Then add the Wix Code to your page to pass date information from one datepicker to another.
Using Wix Code we set the minimum date for the second datepicker (current date for first datepicker).
When users select dates in both datepickers, the number of days will be populated in the text element.
Add two Wix Datepickers to your webpage. Then add the Wix Code to your page to pass date information from one datepicker to another.
THE ELEMENTS
The Page
Datepicker Element:
-
Start Date: #datePicker1
-
End Date: #datePicker2
THE CODE
Page Code
$w.onReady(function () {
$w("#datePicker1").onChange((event) => {
console.log(event.target.value);
let newdate = new Date(event.target.value);
newdate.setDate(newdate.getDate() + 1);
$w("#datePicker2").value = newdate;
$w("#datePicker2").minDate = newdate;
});
});
COMMENTS
I'm a paragraph. Click here to add your own text and edit me. It's easy.