DevExtreme Angular - Specify Value Range
To specify the date or time range, use the min and max options.
jQuery
JavaScript
$(function() { $("#dateBoxContainer").dxDateBox({ value: "2015/12/31", type: "date", min: "2015/1/1", max: "2015/12/31" }); });
Angular
HTML
TypeScript
<dx-date-box value="2015/12/31" type="date" min="2015/1/1" max="2015/12/31"> </dx-date-box>
import { DxDateBoxModule } from "devextreme-angular"; // ... export class AppComponent { // ... } @NgModule({ imports: [ // ... DxDateBoxModule ], // ... })
If an entered value falls out of the range, the widget displays an error message. To change the message text, specify the dateOutOfRangeMessage option.
jQuery
JavaScript
$(function() { $("#dateBoxContainer").dxDateBox({ value: "2015/12/31", type: "date", min: "2015/1/1", max: "2015/12/31", dateOutOfRangeMessage: "Date is out of range" }); });
Angular
HTML
TypeScript
<dx-date-box value="2015/12/31" type="date" min="2015/1/1" max="2015/12/31" dateOutOfRangeMessage="Date is out of range"> </dx-date-box>
import { DxDateBoxModule } from "devextreme-angular"; // ... export class AppComponent { // ... } @NgModule({ imports: [ // ... DxDateBoxModule ], // ... })
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.