Yii2超好用的日期和时间组件(值得收藏)


Posted in PHP onMay 05, 2016

日期组件,时间组件在平时开发中是必不可少的。今天我们就来谈谈在yii2中的超好用的时间组件,也省的大家各种找js插件了。

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

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超好用的日期和时间组件(值得收藏)

PHP 相关文章推荐
php 字符转义 注意事项
May 27 PHP
phpmyadmin3 安装配置图解教程
Mar 29 PHP
php读取mysql的简单实例
Jan 15 PHP
浅析php中json_encode()和json_decode()
May 25 PHP
CodeIgniter输出中文乱码的两种解决办法
Jun 12 PHP
php写的AES加密解密类分享
Jun 20 PHP
php生成百度sitemap站点地图类函数实例
Oct 17 PHP
迪菲-赫尔曼密钥交换(Diffie?Hellman)算法原理和PHP实现版
May 12 PHP
WordPress开发中短代码的实现及相关函数使用技巧
Jan 05 PHP
[原创]PHP字符串中插入子字符串方法总结
May 06 PHP
使用正则去除php代码中的注释方法
Nov 03 PHP
yii2 开发api接口时优雅的处理全局异常的方法
May 14 PHP
joomla实现注册用户添加新字段的方法
May 05 #PHP
Joomla数据库操作之JFactory::getDBO用法
May 05 #PHP
100多行PHP代码实现socks5代理服务器[2]
May 05 #PHP
PHP随机数 C扩展随机数
May 04 #PHP
PHP正则表达式过滤html标签属性(DEMO)
May 04 #PHP
Joomla使用Apache重写模式的方法
May 04 #PHP
Joomla开启SEF的方法
May 04 #PHP
You might like
php读取文件内容到数组的方法
2015/03/16 PHP
兼容FireFox 的 js 日历 支持时间的获取
2009/03/04 Javascript
有关js的变量作用域和this指针的讨论
2010/12/16 Javascript
js字符串的各种格式的转换 ToString,Format
2011/08/08 Javascript
JS图片根据鼠标滚动延时加载的实例代码
2013/07/13 Javascript
jQuery function的正确书写方法
2013/08/02 Javascript
js从10种颜色中随机取色实现每次取出不同的颜色
2013/10/23 Javascript
JS特效实现图片自动播放并可控的效果
2015/07/31 Javascript
js实现input框文字动态变换显示效果
2015/08/19 Javascript
Java Mybatis框架入门基础教程
2015/09/21 Javascript
JS实现网页上随机产生超链接地址的方法
2015/11/09 Javascript
浏览器检测JS代码(兼容目前各大主流浏览器)
2016/02/21 Javascript
完美解决UI-Grid表格元素中多个空格显示为一个空格的问题
2017/04/25 Javascript
nodejs之get/post请求的几种方式小结
2017/07/26 NodeJs
Vue.js实现分页查询功能
2020/11/15 Javascript
详解NodeJS Https HSM双向认证实现
2019/03/12 NodeJs
[03:28]2014DOTA2国际邀请赛 EG战队官方纪录片
2014/07/21 DOTA
[01:06:54]DOTA2-DPC中国联赛 正赛 RNG vs Dragon BO3 第一场 1月24日
2021/03/11 DOTA
Python批量转换文件编码格式
2015/05/17 Python
一张图带我们入门Python基础教程
2017/02/05 Python
python中numpy基础学习及进行数组和矢量计算
2017/02/12 Python
Python BeautifulSoup [解决方法] TypeError: list indices must be integers or slices, not str
2019/08/07 Python
美国花园雕像和家居装饰网上商店:Design Toscano
2019/03/09 全球购物
机关财务管理制度
2014/01/17 职场文书
《乌鸦和狐狸》教学反思
2014/02/08 职场文书
《鱼游到了纸上》教学反思
2014/02/20 职场文书
公司办公室岗位职责
2014/03/19 职场文书
《飞向蓝天的恐龙》教学反思
2014/04/09 职场文书
珍惜时间演讲稿
2014/05/14 职场文书
公司地址变更通知
2015/04/25 职场文书
幼儿园毕业典礼园长致辞
2015/07/29 职场文书
详解CocosCreator项目结构机制
2021/04/14 Javascript
SpringBoot连接MySQL获取数据写后端接口的操作方法
2021/11/02 MySQL
MyBatis配置文件解析与MyBatis实例演示
2022/04/07 Java/Android
HTML页面中使两个div并排显示的实现
2022/05/15 HTML / CSS
SpringCloud超详细讲解Feign声明式服务调用
2022/06/21 Java/Android