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 mvc开发模式的感想
Jun 28 PHP
php数组函数序列之array_push() 数组尾部添加一个或多个元素(入栈),返回新长度。
Nov 07 PHP
PHP file_exists问题杂谈
May 07 PHP
解析php DOMElement 操作xml 文档的实现代码
May 10 PHP
学习php中的正则表达式
Aug 17 PHP
一款简单实用的php操作mysql数据库类
Dec 08 PHP
PHP使用fopen与file_get_contents读取文件实例分享
Mar 04 PHP
php实现在站点里面添加邮件发送的功能
Apr 28 PHP
Yii的Srbac插件用法详解
Jul 14 PHP
PHP文件上传操作实例详解
Sep 27 PHP
详解PHP中foreach的用法和实例
Oct 25 PHP
浅析PHP中的 inet_pton 网络函数
Dec 16 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 preg_replace替换实例讲解
2013/11/04 PHP
PHP接入微信H5支付的方法示例
2019/10/28 PHP
PhpStorm的使用教程(本地运行PHP+远程开发+快捷键)
2020/03/26 PHP
php中使用array_filter()函数过滤数组实例讲解
2021/03/03 PHP
javascript 实现父窗口引用弹出窗口的值的脚本
2007/08/07 Javascript
再谈javascript面向对象编程
2012/03/18 Javascript
jQuery-onload让第一次页面加载时图片是淡入方式显示
2012/05/23 Javascript
jquery表单验证框架提供的身份证验证方法(示例代码)
2013/12/27 Javascript
JavaScript中Number.MAX_VALUE属性的使用方法
2015/06/04 Javascript
js精美的幻灯片画集特效代码分享
2015/08/29 Javascript
JavaScript常用字符串与数组扩展函数小结
2016/04/24 Javascript
jqPlot jQuery绘图插件的使用
2016/06/18 Javascript
微信小程序 wx.uploadFile无法上传解决办法
2016/12/14 Javascript
javascript 注释代码的几种方法总结
2017/01/04 Javascript
详解Angular 开发环境搭建
2017/06/22 Javascript
NodeJS使用七牛云存储上传文件的方法
2017/07/24 NodeJs
Vue侧滑菜单组件——DrawerLayout
2017/12/18 Javascript
Angular实现的简单查询天气预报功能示例
2017/12/27 Javascript
react-native动态切换tab组件的方法
2018/07/07 Javascript
小程序组件之仿微信通讯录的实现代码
2018/09/12 Javascript
Vue CLI 3.x 自动部署项目至服务器的方法
2019/04/02 Javascript
详解小程序用户登录状态检查与更新实例
2019/05/15 Javascript
基于js实现抽红包并分配代码实例
2019/09/19 Javascript
详细解读Python中的__init__()方法
2015/05/02 Python
python 队列详解及实例代码
2016/10/18 Python
python通过elixir包操作mysql数据库实例代码
2018/01/31 Python
python类中super() 的使用解析
2019/12/19 Python
基于Modernizr 让网站进行优雅降级的分析
2013/04/21 HTML / CSS
法律专业应届本科毕业生求职信
2013/10/25 职场文书
爱护公共设施的标语
2014/06/24 职场文书
解除施工合同协议书
2014/10/17 职场文书
2015年团队工作总结范文
2015/05/04 职场文书
学会用Python实现滑雪小游戏,再也不用去北海道啦
2021/05/20 Python
mysql中between的边界,范围说明
2021/06/08 MySQL
php实现自动生成验证码的实例讲解
2021/11/17 PHP
Java中try catch处理异常示例
2021/12/06 Java/Android