目录

  • 颜色选择器

  • 日期控件

  • 时间控件

  • 日期时间控件

  • 日期范围选择控件

  • 图片上传控件

  • 多图上传控件

  • 文件上传控件

  • 多文件上传控件

  • 省市区三级联动

  • 百度编辑器

颜色选择器

use kartik\color\ColorInput;
<?= $form->field($model, 'color')->widget(ColorInput::classname(), [
    'options' => ['placeholder' => '请选择颜色'],
]);?>

日期控件

<?= $form->field($model,'test')->widget('kartik\date\DatePicker',[
    'language'  => 'zh-CN',
    'layout'=>'{picker}{input}',
    'pluginOptions' => [
        'format'         => 'yyyy-mm-dd',
        'todayHighlight' => true,//今日高亮
        'autoclose'      => true,//选择后自动关闭
        'todayBtn'       => true,//今日按钮显示
    ],
    'options'=>[
        'class'     => 'form-control no_bor',
        'readonly'  => 'readonly',//禁止输入
    ]
]);?>

时间控件

<?= $form->field($model,'test')->widget('kartik\time\TimePicker',[
          'language'  => 'zh-CN',
          'pluginOptions' => [
                 'showSeconds' => true
            ]
]);?>

日期时间控件

use dosamigos\datetimepicker\DateTimePicker;
<?= $form->field($model, 'test')->widget(DateTimePicker::className(), [
    'language' => 'zh-CN',
    'template' => '{button}{reset}{input}',
    'options'   => [
        'value'     => $model->isNewRecord ? '' : date('Y-m-d H:i:s',$model->test),
    ],
    'clientOptions' => [
        'format'         => 'yyyy-mm-dd hh:ii:ss',
        'todayHighlight' => true,//今日高亮
        'autoclose'      => true,//选择后自动关闭
        'todayBtn'       => true,//今日按钮显示
    ]

]);?>

图片上传控件

<?= $form->field($model, 'cover')->widget('backend\widgets\webuploader\Image', [
    'boxId' => 'cover',
     //可设置自己的上传地址
     //'pluginOptions' => [
     //    'uploadUrl' => Url::to(['/file/qiniu']),//七牛上传 (二选一)
     //    'uploadUrl' => Url::to(['/file/ali-oss']),//阿里云Oss上传
     //],
    'options' => [
        'multiple'   => false,
    ]
]);?>

多图上传控件

目前存储数据库需要序列化存入,不然再次解析编辑会报错

<?= $form->field($model, 'cover[]')->widget('backend\widgets\webuploader\Image', [
    'boxId' => 'cover',
    'options' => [
        'multiple'   => true,
    ]
]);?>

文件上传控件

<?= $form->field($model, 'file')->widget('backend\widgets\webuploader\File', [
    'boxId' => 'file',
    'options' => [
        'mimeTypes'  => 'video/*',//上传文件类型 video/*表示只能上传视频格式的文件
        'multiple'   => false,
    ]
]);?>

多文件上传控件

<?= $form->field($model, 'file[]')->widget('backend\widgets\webuploader\File', [
    'boxId' => 'file',//唯一id
    'options' => [
        'mimeTypes'  => 'video/*',//上传文件类型 如果填写*则不限文件类型
        'multiple'   => true,
    ]
]);?>

省市区三级联动

<?= \backend\widgets\provinces\Provinces::widget([
     'form'          => $form,
     'model'         => $model,
     'provincesName' => 'provinces',
     'cityName'      => 'city',
     'areaName'      => 'area',
  ])?>

百度编辑器

视图

<?= $form->field($model, 'content')->widget(\crazydb\ueditor\UEditor::className()) ?>

上次更新:2018-08-14