自定义 yii2 日期时间选择器
Customize yii2 date time picker
PHP 7.0.33 和 yii2 2.0.16 这里.
我需要自定义一个 yii2 日期时间选择器,但我在某个时候卡住了。我查看了一些扩展,最终使用了以下扩展,因为它让我最接近我想要实现的目标:
https://github.com/kartik-v/yii2-date-range
所以,我的代码是这样的:
$dateRangePickerOptions = [
'language' => 'en',
'name'=>'date_end',
'convertFormat' => true,
'pluginOptions' => [
'timePicker' => true,
'timePickerIncrement' => 30,
'locale' => [
'format' => 'Y-m-d H:i',
],
'singleDatePicker' => true,
'showDropdowns' => true,
]
];
$form = ActiveForm::begin();
echo $form->field($model, 'date_end')->widget(DateRangePicker::classname(), $dateRangePickerOptions);
ActiveForm::end();
结果是这样的:
差不多好了,但有几点我不知道是否可以自定义:
我希望 AM/PM 下拉菜单消失,时间下拉菜单以 24 小时格式显示小时数。
当我开始选择日期、时间、分钟时,目标表单元素的边框变为红色,警告我该字段不能为空。是的,该字段不能为空,但在我点击应用按钮之前不能显示警告。
除了这些,我也在想一些'nice to have'定制:
周六日禁用
小时下拉字段的选项应该只显示 7 到 16 之间的小时。
我还查看了这个扩展作为替代:https://github.com/kartik-v/yii2-widget-datetimepicker
但这都不能让我完全实现我所描述的。
我愿意接受任何建议,甚至是完全不同的 extensions/approaches,只要我能达到所描述的要点。
您需要使用 bootstrap 插件的选项 timePicker24Hour
,请参阅选项 http://www.daterangepicker.com/#options
您的选项数组应该类似于
$dateRangePickerOptions = [
'language' => 'en',
'name'=>'date_end',
'convertFormat' => true,
'pluginOptions' => [
'timePicker' => true,
'timePickerIncrement' => 30,
'locale' => [
'format' => 'Y-m-d H:i',
],
'singleDatePicker' => true,
'showDropdowns' => true,
'timePicker24Hour'=>true
]
];
PHP 7.0.33 和 yii2 2.0.16 这里.
我需要自定义一个 yii2 日期时间选择器,但我在某个时候卡住了。我查看了一些扩展,最终使用了以下扩展,因为它让我最接近我想要实现的目标:
https://github.com/kartik-v/yii2-date-range
所以,我的代码是这样的:
$dateRangePickerOptions = [
'language' => 'en',
'name'=>'date_end',
'convertFormat' => true,
'pluginOptions' => [
'timePicker' => true,
'timePickerIncrement' => 30,
'locale' => [
'format' => 'Y-m-d H:i',
],
'singleDatePicker' => true,
'showDropdowns' => true,
]
];
$form = ActiveForm::begin();
echo $form->field($model, 'date_end')->widget(DateRangePicker::classname(), $dateRangePickerOptions);
ActiveForm::end();
结果是这样的:
差不多好了,但有几点我不知道是否可以自定义:
我希望 AM/PM 下拉菜单消失,时间下拉菜单以 24 小时格式显示小时数。
当我开始选择日期、时间、分钟时,目标表单元素的边框变为红色,警告我该字段不能为空。是的,该字段不能为空,但在我点击应用按钮之前不能显示警告。
除了这些,我也在想一些'nice to have'定制:
周六日禁用
小时下拉字段的选项应该只显示 7 到 16 之间的小时。
我还查看了这个扩展作为替代:https://github.com/kartik-v/yii2-widget-datetimepicker
但这都不能让我完全实现我所描述的。 我愿意接受任何建议,甚至是完全不同的 extensions/approaches,只要我能达到所描述的要点。
您需要使用 bootstrap 插件的选项 timePicker24Hour
,请参阅选项 http://www.daterangepicker.com/#options
您的选项数组应该类似于
$dateRangePickerOptions = [
'language' => 'en',
'name'=>'date_end',
'convertFormat' => true,
'pluginOptions' => [
'timePicker' => true,
'timePickerIncrement' => 30,
'locale' => [
'format' => 'Y-m-d H:i',
],
'singleDatePicker' => true,
'showDropdowns' => true,
'timePicker24Hour'=>true
]
];