JavaScript/jQuery DateBox - Specify Value Range
To specify the date or time range, use the min and max properties.
App.vue
- <template>
- <DxDateBox
- value="2015/12/31"
- type="date"
- min="2015/1/1"
- max="2015/12/31"
- />
- </template>
- <script>
- import 'devextreme/dist/css/dx.light.css';
- import DxDateBox from 'devextreme-vue/date-box';
- export default {
- components: {
- DxDateBox
- }
- }
- </script>
If an entered value falls out of the range, the UI component displays an error message. To change the message text, specify the dateOutOfRangeMessage property.
App.vue
- <template>
- <DxDateBox
- value="2015/12/31"
- type="date"
- min="2015/1/1"
- max="2015/12/31"
- date-out-of-range-message="Date is out of range"
- />
- </template>
- <script>
- import 'devextreme/dist/css/dx.light.css';
- import DxDateBox from 'devextreme-vue/date-box';
- export default {
- components: {
- DxDateBox
- }
- }
- </script>
See Also
Feel free to share topic-related thoughts here.
If you have technical questions, please create a support ticket in the DevExpress Support Center.
Thank you for the feedback!
If you have technical questions, please create a support ticket in the DevExpress Support Center.