Skip to main content

filter-data

Description​

Fires when filters are applied

Usage​

"filter-data": ({
    text: string,
    date:{ 
        start: Date | null,
        end: Date | null
    },
    time:[{ 
        from: number | string,
        to: number | string
    }]
 }) => void;

Parameters​

The callback of the filter-data event can take an object with the following parameters:

  • text - (required) the text in the search field
  • date - (required) Date object with the start and end date for a slot:
    • start - the slot start date
    • end - the slot end date
  • time - (required) an array of objects containing time options for a slot. For each object, you can specify the following parameters:
    • from - (required) the start time for a slot; it can be a number from 0 to 24 that specifies the time in hours (e.g., 9 means 9:00, 8.5 means 8:30) or a string in the format "h:m" (for example, "8:30")
    • to - (required) the end time for a slot; it can be a number from 0 to 24 that specifies the time in hours (e.g., 9 means 9:00, 8.5 means 8:30) or a string in the format "h:m" (for example, "8:30")

Example​

The example below demonstrates how to apply filter at the initialization using the api.exec() method:

// create Booking
const booking = new booking.Booking("#root", {
    data,
    // other configuration parameters
});
booking.api.exec("filter-data", {
    text: "Allergist",
    date: {
        start: new Date,
        end: new Date(2025, 4, 10)
    },
    time: [
        {
            from: 12,
            to: 20
        }
    ]
});