Vorbly Code | WIX DATEPICKER START & END FROM DATABASE

Vorbly <Code>

CODING MADE EASY WITH VORBLY

WIX DATEPICKER START & END FROM DATABASE

Starting a booking website? This tutorial will show you how to set start and end dates for your Wix Datepicker from your database. We will provide you with the webpage elements and sample codes required to implement this feature.

THE DEMO

1/2

THE ELEMENTS

The Page

Datepicker Element: #datePicker1

The Database

Create a database: Booking (dataset1)

Recommended fields:

  • Start Date: start

  • End Date: end

Create a dynamic page for your hotels or products or services.

THE CODE

Page Code

$w.onReady(function () {

$w("#dataset1").onReady(() => {

 

// Retrieve min & max dates from dataset //

let startDate = $w("#dataset1").getCurrentItem().start;

let endDate = $w("#dataset1").getCurrentItem().end;

 

// Set min & max dates for datepickers //

$w("#datePicker1").minDate = startDate;

$w("#datePicker1").maxDate = endDate;

$w("#datePicker2").minDate = startDate;

$w("#datePicker2").maxDate = endDate;

 

});

});

COMMENTS

I'm a paragraph. Click here to add your own text and edit me. It's easy.

WEB DESIGN & DEVELOPMENT SOLUTIONS

GET PROFESSIONAL HELP