DateRangePicker API Overview

Initialization

<script>
    import { DateRangePicker } from "wx-svelte-core";
</script>

<!-- minimal configuration for initialization -->
<DateRangePicker />

tip

• Visit the Features Guide to learn more about the control's functionality.
• Explore the samples to visualize the available features.

DateRangePicker Properties

align	specifies the alignment of a popup with calendars relative to the input field
buttons	shows/hides the Today and Clear buttons in the lower part of the popup with calendars
clear	adds the Clear button into the input
css	changes the position of the icon in the input
disabled	defines whether a date range picker is disabled
done	shows/hides the Done button
editable	defines whether a date range picker is editable or sets a custom format for editing dates
error	defines whether error styling is applied to a date range picker
format	sets the date format for a date range picker input
id	sets an HTML id for a date range picker
months	sets the number of calendars in DateRangePicker
placeholder	sets the text of the input's placeholder
title	sets a tooltip text with additional info about the control
value	sets the value of a date range picker
width	sets the width of a popup with calendars

DatePicker Events

change	fires when a new option is selected in a date range picker