README

基于 Eonasdan 的 Bootstrap 3 日期/时间选择小部件的 Yii2 框架日期/时间选择小部件 Eonasdan's Bootstrap 3 Date/Time Picker

演示

由于这是 yii2-starter-kit 的一部分，其演示可以在启动套件演示中找到 此处。

Login: webmaster
Password: webmaster

开始之前

确保您已安装 fxp/composer-asset-plugin

composer global require fxp/composer-asset-plugin

安装

通过 composer 安装此扩展是首选方式。

运行

php composer.phar require trntv/yii2-datetime-widget

或添加

"trntv/yii2-datetime-widget": "*"

到您的 composer.json 文件的 require 部分。

使用方法

扩展安装完成后，只需在您的代码中通过以下方式使用它：

<?php echo $form->field($model, 'attribute')->widget(
        'trntv\yii\datetime\DateTimeWidget',
        [ ... options ... ]
    ); 
?>

选项

phpDatetimeFormat - PHP ICU 日期时间格式（默认：dd.MM.yyyy, HH:mm）

momentDatetimeFormat - Moment JS 日期时间格式（默认：DD.MM.YYYY, HH:mm）

showAddon - 显示或隐藏输入附加组件（默认：true）

addonContent - 附加组件内容

phpMomentMapping - 格式映射（默认：true）

containerOptions - 小部件容器选项

clientOptions - 所有可用选项的完整列表

** 注意：要在按钮组中使用时，启用小部件在文本框聚焦时显示，请使用 allowInputToggle 选项

...
'clientOptions' => [
    'allowInputToggle' => true
]
...

示例

ActiveField 输入小部件

<?php echo $form->field($model, 'datetime')->widget(
    'trntv\yii\datetime\DateTimeWidget',
    [
        'phpDatetimeFormat' => 'yyyy-MM-dd\'T\'HH:mm:ssZZZZZ',
        'clientOptions' => [
            'minDate' => new \yii\web\JsExpression('new Date("2015-01-01")'),
            'allowInputToggle' => false,
            'sideBySide' => true,
            'locale' => 'zh-cn',
            'widgetPositioning' => [
               'horizontal' => 'auto',
               'vertical' => 'auto'
            ]
        ]
    ]
]); ?>

仅日期的独立小部件

<?php echo trntv\yii\datetime\DateTimeWidget::widget([
    'phpDatetimeFormat' => 'yyyy-MM-dd',
]) ; ?>

添加自定义 JS 事件

<?php echo trntv\yii\datetime\DateTimeWidget::widget([
    'clientEvents' => [
        'dp.change' => 'function(e){
            console.log('dp.change');
        }',
    ],
]) ; ?>