Angular DateBox - Control the Behavior

The DateBox UI component allows an end user to pick or type a value. To specify whether the value should be applied instantly or when a user clicks the Done button, set the applyValueMode property. Note that this property takes effect only when the pickerType is "calendar" or "list".

App.vue
  • <template>
  • <DxDateBox
  • :value="date"
  • type="date"
  • picker-type="calendar",
  • apply-value-mode="useButtons"/> <!-- or "instantly" -->
  • </template>
  •  
  • <script>
  • import 'devextreme/dist/css/dx.common.css';
  • import 'devextreme/dist/css/dx.light.css';
  •  
  • import DxDateBox from 'devextreme-vue/date-box';
  •  
  • export default {
  • components: {
  • DxDateBox
  • },
  • data() {
  • return {
  • date: new Date()
  • };
  • }
  • }
  • </script>
See Also