Skip to content

Commit 0df916e

Browse files
DateBox: fix formatting of min/max attribute in datetime picker type (T1252602) (#28681)
1 parent c7a72ba commit 0df916e

File tree

2 files changed

+50
-2
lines changed

2 files changed

+50
-2
lines changed

packages/devextreme/js/__internal/ui/date_box/m_date_box.strategy.native.ts

Lines changed: 10 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -67,9 +67,17 @@ const NativeStrategy = DateBoxStrategy.inherit({
6767
},
6868

6969
renderInputMinMax($input) {
70+
const type = this.dateBox.option('type');
71+
const defaultFormat = 'yyyy-MM-dd';
72+
const format = {
73+
datetime: 'yyyy-MM-ddTHH:mm:ss',
74+
date: defaultFormat,
75+
time: 'HH:mm:ss',
76+
}[type] ?? defaultFormat;
77+
7078
$input.attr({
71-
min: dateSerialization.serializeDate(this.dateBox.dateOption('min'), 'yyyy-MM-dd'),
72-
max: dateSerialization.serializeDate(this.dateBox.dateOption('max'), 'yyyy-MM-dd'),
79+
min: dateSerialization.serializeDate(this.dateBox.dateOption('min'), format),
80+
max: dateSerialization.serializeDate(this.dateBox.dateOption('max'), format),
7381
});
7482
},
7583
});

packages/devextreme/testing/tests/DevExpress.ui.widgets.editors/datebox.tests.js

Lines changed: 40 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -248,6 +248,46 @@ QUnit.module('datebox tests', moduleConfig, () => {
248248
assert.equal($dropDownButton.length, expectedButtonsNumber, 'correct readOnly value');
249249
});
250250

251+
QUnit.test('Datebox should set min/max attributes to datetime input in localized datetime format (T1252602)', function(assert) {
252+
const $dateBox = $('#dateBox').dxDateBox({
253+
type: 'datetime',
254+
pickerType: 'native',
255+
value: new Date(2024, 8, 15, 16, 54, 10),
256+
min: new Date(2024, 8, 10, 16, 54, 14),
257+
max: new Date(2024, 8, 27, 16, 54, 15)
258+
});
259+
260+
const $input = $dateBox.find(`.${TEXTEDITOR_INPUT_CLASS}`);
261+
assert.equal($input.attr('min'), '2024-09-10T16:54:14', 'minimum date set correctly');
262+
assert.equal($input.attr('max'), '2024-09-27T16:54:15', 'maximum date set correctly');
263+
});
264+
265+
QUnit.test('Datebox should set min/max attributes to time input in localized time format (T1252602)', function(assert) {
266+
const $dateBox = $('#dateBox').dxDateBox({
267+
type: 'time',
268+
pickerType: 'native',
269+
value: new Date(2024, 8, 10, 16, 30),
270+
min: new Date(2024, 8, 10, 12, 0, 14),
271+
max: new Date(2024, 8, 10, 18, 0, 15)
272+
});
273+
const $input = $dateBox.find(`.${TEXTEDITOR_INPUT_CLASS}`);
274+
assert.equal($input.attr('min'), '12:00:14', 'minimum time set correctly');
275+
assert.equal($input.attr('max'), '18:00:15', 'maximum time set correctly');
276+
});
277+
278+
QUnit.test('Datebox should set min/max attributes to date input in localized date format (T1252602)', function(assert) {
279+
const $dateBox = $('#dateBox').dxDateBox({
280+
type: 'date',
281+
pickerType: 'native',
282+
value: new Date(2024, 8, 15),
283+
min: new Date(2024, 8, 10),
284+
max: new Date(2024, 8, 20)
285+
});
286+
const $input = $dateBox.find(`.${TEXTEDITOR_INPUT_CLASS}`);
287+
assert.equal($input.attr('min'), '2024-09-10', 'minimum date set correctly');
288+
assert.equal($input.attr('max'), '2024-09-20', 'maximum date set correctly');
289+
});
290+
251291
QUnit.test('Datebox should set min and max attributes to the native input (T258860) after option changed', function(assert) {
252292
const $dateBox = $('#dateBox').dxDateBox({
253293
type: 'date',

0 commit comments

Comments
 (0)