1

開始日と終了日のページに Kendo Datepicker フィールドのペアがあります。開始日はデフォルトで今日の日付に設定され、終了日はデフォルトで 1 年後の今日の日付に設定されます。ユーザーは、Kendo Datepicker カレンダーから日付を選択するか、手動で日付を入力できます。

[終了日] フィールドの Datepicker カレンダー ポップアップには「最大」オプションが設定されているため、現在から 1 年を超える日付は表示されませんが、ユーザーは後の日付を手動で入力できます。その場合、フォームで [送信] をクリックすると、サーバー側の検証によって問題が検出され、エラーが表示されてフォームが再度表示されます。

ユーザーが Datepicker フィールドに手動で入力した日付をそのまま残して、問題の原因を確認できるようにしたいのですが、カレンダーの「最大」オプションはそのままにしておきます。しかし、Datepicker オプションを「最大値」と最大値の後の「値」で設定すると、値が間違った形式で表示されます。

複製する方法は次のとおりです。

HTML:

<!-- Note future date in 'value' attribute. -->
<input id='dateField' style="width: 100%;" type="text" value="20160618">

JS:

var dateField = $("#dateField");

// The DatePicker's value comes from the dateField's 'value' attribute.
var value = moment(dateField.val(), 'YYYYMMDD').toDate(); // moment().toDate() gives a JavaScript Date object.

// Initialize the date picker options object with some common settings.
datePickerOptions = {
    format: 'MM/dd/yyyy',
    value: value,
}

// Set the max to be one year from now.
datePickerOptions.max = new Date(moment(new Date()).add('years', 1).toDate());

// Initialize the DatePicker.
dateField.kendoDatePicker(datePickerOptions);

// Here's a workaround I found... After initializing the picker, manually set the value back to the correctly formatted string.
//dateField.val(moment(value).format('MM/DD/YYYY'));

上記のコードをjsFiddleします。

入力タグの「値」属性を最大日付より後の日付に設定すると、日付は次のように表示されます。

金 6 月 19 2015 00:00:00 GMT-0700 (太平洋標準時)

それがどうあるべきかの代わりに：

2015/06/15

これは剣道のバグですか、それとも設計上壊れていますか? それとも私はどこかでふざけていますか？

4

1 に答える 1

2

ええ、コントロールはうまくいっているようです。問題は、最大のテストでコントロールがすぐに失敗することです。つまり、他のオプション (たとえば、フォーマット) が適用されません。私は壊れたデザインに投票します。

これを試して...

datePickerOptions = {
    format: 'MM/dd/yyyy',
    value: moment(value).format('MM/DD/YYYY'),
    max: new Date(moment(new Date()).add('years', 1).toDate())
}
于 2014-06-18T21:38:34.803 に答える