日期组件,时间组件在平时开发中是必不可少的。今天我们就来谈谈在yii2中的超好用的时间组件。

分享之前我们先预览下效果,看看到底怎么个好用法。

当然啦,好用不好用在于自我的感觉,光看上面的图片是感受不到的。再告诉你个好消息,这两款插件已经跟yii2整合了,使用起来也是灰常的简单哦。
关于日期组件跟时间组件,前者是date('Y-m-d')类型,后者是date('Y-m-d H:i:s')类型,自然不用多说。
我们先来看看时间组件扩展
既然是扩展组建,第一步当然是安装。

composer require kartik-v/yii2-widget-datetimepicker "*"

安装好之后,如果你的表单使用ActiveForm生成的,可以参考下面的代码

use kartik\datetime\DateTimePicker; <?= $form->field($model, 'created_at')->widget(DateTimePicker::classname(), [ 'options' => ['placeholder' => ''], 'pluginOptions' => [ 'autoclose' => true, 'todayHighlight' => true,
]
]); ?>

有些不喜欢用ActiveForm生成表单的同学就需要参考下面的用法了

use kartik\datetime\DateTimePicker;
echo '<label>时间</label>';
echo DateTimePicker::widget([ 'name' => 'Article[created_at]', 'options' => ['placeholder' => ''], //注意,该方法更新的时候你需要指定value值 'value' => '2016-05-03 22:10:10', 'pluginOptions' => ['autoclose' => true, 'format' => 'yyyy-mm-dd HH:ii:ss', 'todayHighlight' => true
]
]);

至于哪个方便,不言而喻。
整个安装过程确实很简单,我们接下来以同样的方式进行安装日期组件。

composer require kartik-v/yii2-widget-datepicker "@dev"

安装好了后我们开始使用日期组件

use kartik\date\DatePicker;
<?php echo DatePicker::widget([ 'name' => 'Article[created_at]', 'options' => ['placeholder' => '...'], //value值更新的时候需要加上 'value' => '2016-05-03', 'pluginOptions' => [ 'autoclose' => true, 'format' => 'yyyy-mm-dd', 'todayHighlight' => true,
]
]); ?>

看了上面的代码,想必有同学已经猜到针对ActiveForm生成的日期组件的用法了。没错,就那么用,si不si很简单。

<?= $form->field($model, 'created_at')->widget(DatePicker::classname(), [ 'options' => ['placeholder' => ''], 'pluginOptions' => [ 'autoclose' => true, 'todayHighlight' => true, 'format' => 'yyyy-mm-dd',
]
]); ?>

当然,上面的时间格式都是可以调整的,但是,日期组件,既然是日期,肯定也就只支持ymd三种类型的参数,不然跟时间组件又有啥差别。
有些小伙伴说为啥自己的是英文的,用起来很不方便呀,我想反问一句,你的项目是不是没配置语言是中文?还没配置的同学只需要在你的配置文件里面加上 'language'=>'zh-CN', 即可。
最后,我们看看最终的效果图。

Yii2 日期和时间组件相关推荐

  1. LayUI中的基本元素之 日期和时间组件文档

    前言 最近在准备找工作的事项,但是作为一个后台也是需要了解一些前端框架的.就目前的来说有大火的VUE,但是VUE还是存在一定的学习成本,所以决定先从对后台友好的LayUI开始入手先做一些小项目练练手, ...

  2. layer日期和时间组件限制最大日期和 js获取昨天日期

    layer日期和时间组件限制最大日期 html: <input class="layui-input" id="test" autocomplete=&q ...

  3. 《layui宇宙版教程》:日期和时间组件laydate

    <Layui宇宙版教程>提供2000人的QQ群进行交流学习,QQ群号:1046961650,或通过手机QQ扫描二维码进入: 1.19 日期和时间组件laydate 主要以年选择器.年月选择 ...

  4. layDate 日期与时间组件

    在日常的网页开发过程中,日期组件已经成为不可或缺的组件之一.同时,随着广大杰出攻城狮的不懈努力,也出现了很多优秀的日期组件,其中我个人觉得 layDate 日期组件是一个非常不错的组件,简洁易用,样式 ...

  5. 单独使用 laydate 日期时间组件

    layui 日期和时间组件官方文档 需要注意几点: 下载压缩包后,复制整个 laydate 文件夹放到项目中,里面的文件不要改动位置,否则会报错: 在移动端使用时,要给 input 添加 readon ...

  6. BootStrap中的日期时间组件datetimepicker

    使用BootStrap中的日期时间组件需要引入以下三个文件: <!--日期控件--> <link rel="stylesheet" th:href="@ ...

  7. Swing 写的日期时间组件

    Swing 写的日期时间组件 在网上收集的swing时间组件完善了一下,日期上下按钮可以点击,闰年平年判断,月份是多少天自动更新改变.希望大家继续完善. MainApp import java.awt ...

  8. 小程序日期加时间筛选组件

    小程序日期加时间筛选组件 新建component->date-time-picker .wxml <picker mode="multiSelector" class= ...

  9. php根据时间搜索,yii2实现根据时间搜索的方法

    本文实例讲述了yii2实现根据时间搜索的方法.分享给大家供大家参考,具体如下: // date to search $date = DateTime::createFromFormat('m/d/Y' ...

最新文章

  1. C++中模块(Dll)对外暴露接口的方式
  2. Jupyter Notebook显示图像
  3. [原译]11个高效的VS调试技巧
  4. Apache部署网页-Ubuntu16.04
  5. 二十万字C/C++、嵌入式软开面试题全集宝典三
  6. 【Python】简约而不简单|值得收藏的Numpy小抄表(含主要语法、代码)
  7. python真正实现多线程_python多线程实现
  8. 如何在CentOS 7上安装和配置MySQL Cluster
  9. LoadRunner场景设置里的各参数解释
  10. Underlay网络:如何立住可靠又支持大规模无收敛的“人设”
  11. python报表自动化系列 - 拆分一个字符串中的数字和字母
  12. Delphi android 开发视频教程
  13. 【正点原子Linux连载】第六十五章 Linux 音频驱动实验 -摘自【正点原子】I.MX6U嵌入式Linux驱动开发指南V1.0
  14. oracle 范鑫_快速理解数据库中的索引(Indexes in Database)
  15. gmap 支持python吗_在gmap中使用bokeh的python为for circle添加工具提示
  16. 秦小明 第六讲 投融资,资产运作
  17. android 模拟手指点击,『Android Tip』-- 模拟手势操作
  18. 基于C#的电脑录屏和录像(工程源码)
  19. 如何以产品经理角度进行产品分析?
  20. Electron 初探

热门文章

  1. 2018.09.24 codeforces 1053C. Putting Boxes Together(线段树)
  2. Docker容器管理
  3. python thrift 进行filter
  4. hdu 5119 (类似于划分数的状态定义) (DP中的计数问题)
  5. php 获取网站根目录的写法
  6. 巧用FlashPaper 让Word文档变Flash
  7. Storm集群安装Version1.0.1开启Kerberos
  8. idea卸载删除旧版重新安装新版后,新版本idea程序打不开闪退的解决方案
  9. 运筹学与最优化方法_[公开课]运筹学之线性规划算法十二讲
  10. Docker的一些理解(二)