【问题标题】:Customize yii2 date time picker自定义 yii2 日期时间选择器
【发布时间】:2020-06-15 15:02:59
【问题描述】:

这里是 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();

结果是这样的:

几乎不错,但有一些我不知道是否可以自定义:

  1. 我希望 AM/PM 下拉菜单消失,时间下拉菜单以 24 小时格式显示小时。

  2. 当我开始选择日期、时间、分钟时,目标表单元素的边框变为红色,警告我该字段不能为空。没错,该字段不能为空,但在我点击应用按钮之前不能显示警告。

除此之外,我还在考虑一些“值得拥有”的定制:

  1. 周六和周日禁用。

  2. 小时下拉字段的选项应仅显示 7 到 16 之间的小时数。

我还查看了这个扩展作为替代方案:https://github.com/kartik-v/yii2-widget-datetimepicker

但这都不能让我完全实现我所描述的。 只要我能达到所描述的点,我愿意接受任何建议,甚至完全不同的扩展/方法。

【问题讨论】:

  • 您的一个问题中有多个问题,请发布单独的问题以一次解决一个问题。

标签: php bootstrap-4 yii2 kartik-v


【解决方案1】:

需要使用引导插件的选项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
    ]
];

【讨论】:

  • 谢谢! 'timePicker24Hour' 设置解决了我的主要问题。也感谢建议的网站。对于所有可能的定制,这是一个非常有用的参考。
  • @CiprianStoica 不客气,如果对您有用,您可以将答案标记为正确
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2023-03-30
  • 2020-11-29
  • 1970-01-01
相关资源
最近更新 更多