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

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

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

当然啦，好用不好用在于自我的感觉，光看上面的图片是感受不到的。再告诉你个好消息，这两款插件已经跟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', 即可。

最后，我们看看最终的效果图。

赞 (0)

相关推荐

  • Yii2组件之多图上传插件FileInput的详细使用教程

    Yii2组件之多图上传插件FileInput的详细使用教程

    在前面给大家写个有关文件上传的文章,包括最基本的yii2文件上传.异步上传到又拍云以及百度编辑器图片上传的问题,貌似不说点多图上传的就不完美. 今天介绍一款多图上传的插件 FileInput,至于为什么选中了TA作为我们上传的插件,一来这货跟Yii2有一腿,用起来方便:二来嘛,用这个插件不仅添加的时候好操作,修改的时候也可以直接通过异步的方式将图片悄无声息的删掉:最值得一提的是,界面效果融合了bootstrap,清爽简洁美观,看起来舒服. 说重点,看具体步骤 首先还是先安装组件 复制代码 代码如

  • yii2.0使用Plupload实现带缩放功能的多图上传

    本文讲解了plupload的相关代码,实现了ajax多图同时上传,然后将图片进行缩放,最后显示图片,分享给大家供大家参考,具体内容如下 1.文章视图中调用Plupload <?= \common\widgets\Plupload::widget([ 'model'=>$model, 'attribute'=>'cover_img', 'url'=>'/file/upload',//处理文件上传控制器 ])?> 2.\common\widgets\Plupload 组件 <

  • yii2超好用的日期组件和时间组件

    日期组件,时间组件在平时开发中是必不可少的.今天我们就来谈谈在yii2中的超好用的时间组件,也省的大家各种找js插件了. 分享之前我们先预览下效果,看看到底怎么个好用法. 当然啦,好用不好用在于自我的感觉,光看上面的图片是感受不到的.再告诉你个好消息,这两款插件已经跟yii2整合了,使用起来也是灰常的简单哦. 关于日期组件跟时间组件,前者是date('Y-m-d')类型,后者是date('Y-m-d H:i:s')类型,自然不用多说. 我们先来看看时间组件扩展 既然是扩展组建,第一步当然是安装.

  • YII2.0之Activeform表单组件用法实例

    本文实例讲述了YII2.0之Activeform表单组件用法.分享给大家供大家参考,具体如下: Activeform 文本框:textInput(); 密码框:passwordInput(); 单选框:radio(),radioList(); 复选框:checkbox(),checkboxList(); 下拉框:dropDownList(); 隐藏域:hiddenInput(); 文本域:textarea(['rows'=>3]); 文件上传:fileInput(); 提交按钮:submitBu

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

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

    日期组件,时间组件在平时开发中是必不可少的.今天我们就来谈谈在yii2中的超好用的时间组件,也省的大家各种找js插件了. 分享之前我们先预览下效果,看看到底怎么个好用法. 当然啦,好用不好用在于自我的感觉,光看上面的图片是感受不到的.再告诉你个好消息,这两款插件已经跟yii2整合了,使用起来也是灰常的简单哦. 关于日期组件跟时间组件,前者是date('Y-m-d')类型,后者是date('Y-m-d H:i:s')类型,自然不用多说. 我们先来看看时间组件扩展 既然是扩展组建,第一步当然是安装.

  • JS匹配日期和时间的正则表达式示例

    本文实例讲述了JS匹配日期和时间的正则表达式.分享给大家供大家参考,具体如下: //日期的正则表达式 var reg = /^[1-9]\d{3}-(0[1-9]|1[0-2])-(0[1-9]|[1-2][0-9]|3[0-1])$/; var regExp = new RegExp(reg); if(!regExp.test(value)){ alert("日期格式不正确,正确格式为:2014-01-01"); return; } //时间的正则表达式 var reg = /^(2

  • 如何获知文件最后的修改日期和时间？

    <%Dim objCMFUDim strModified Set objCMFU = Server.CreateObject("CM_FileUtils.GetProperty")' 创建对象并赋给变量,并且GetProperty类是当前唯一可用的. strModified = objCMFU.LastModified' 检索并返回包含最后修改日期和时间(LastModified function )值.当然了,还要考虑到出错的可能. Set objCMFU = Nothing'

  • Perl中的10个操作日期和时间的CPAN模块介绍

    能够操控日期和时间对于大多数编程语言来说是基本的能力,Perl也不例外.但是在碰到与时间相关的更加复杂的处理时,Perl自带的功能常常就显得力不从心了.在这种情况下,上Perl综合典藏网(CPAN)看看是一个好主意,上面有很多随时可以使用的Perl模块,让开发人员能够有效地进行日期和时间操作.花点时间浏览这个网站看看是否能够找到一些在下一个项目里用得上的东西是值得的. 本文列出了Perl CPAN上用来操控日期和时间的10个最有趣的模块,为您下一次转化时区和计算两个时间戳之间的秒数打下了基础,现

  • DB2 日期和时间的函数应用说明

    DAYNAME 返回一个大小写混合的字符串,对于参数的日部分,用星期表示这一天的名称(例如,Friday). DAYOFWEEK 返回参数中的星期几,用范围在 1-7 的整数值表示,其中 1 代表星期日. DAYOFWEEK_ISO 返回参数中的星期几,用范围在 1-7 的整数值表示,其中 1 代表星期一. DAYOFYEAR 返回参数中一年中的第几天,用范围在 1-366 的整数值表示. DAYS 返回日期的整数表示. JULIAN_DAY 返回从公元前 4712 年 1 月 1 日(儒略日历

  • Yii2框架引用bootstrap中日期插件yii2-date-picker的方法

    本文实例讲述了Yii2框架引用bootstrap中日期插件yii2-date-picker的方法.分享给大家供大家参考,具体如下: 最近在学习yii2 框架,发现框架很强大,而且结合了时下许多新的技术在里面. 简单记录一下yii2-date-picker插件的使用方法: 首先先了解一下github中的相关资源:https://github.com/2amigos/yii2-date-picker-widget 其次:在自己的项目中利用上面链接中的相关方法下载此资源,命令为: php compos

  • Java 8中日期和时间的处理方法

    Java 8新增了LocalDate和LocalTime接口,为什么要搞一套全新的处理日期和时间的API?因为旧的java.util.Date实在是太难用了. java.util.Date月份从0开始,一月是0,十二月是11,变态吧!java.time.LocalDate月份和星期都改成了enum,就不可能再用错了. java.util.Date和SimpleDateFormatter都不是线程安全的,而LocalDate和LocalTime和最基本的String一样,是不变类型,不但线程安全,

  • Java8新特性之深入解析日期和时间_动力节点Java学院整理

    Java8新特性之深入解析日期和时间_动力节点Java学院整理

    日期是商业逻辑计算一个关键的部分,任何企业应用程序都需要处理时间问题.应用程序需要知道当前的时间点和下一个时间点,有时它们还必须计算这两个时间点之间的路径.但java之前的日期做法太令人恶心了,我们先来吐槽一下 吐槽java.util.Date跟Calendar Tiago Fernandez做过一次投票,选举最烂的JAVA API,排第一的EJB2.X,第二的就是日期API. 槽点一 最开始的时候,Date既要承载日期信息,又要做日期之间的转换,还要做不同日期格式的显示,职责较繁杂(不懂单一职

  • python中日期和时间格式化输出的方法小结

    本文实例总结了python中日期和时间格式化输出的方法.分享给大家供大家参考.具体分析如下: python格式化日期时间的函数为datetime.datetime.strftime():由字符串转为日期型的函数为:datetime.datetime.strptime(),两个函数都涉及日期时间的格式化字符串,这里提供详细的代码详细演示了每一个参数的使用方法及范例. 下面是格式化日期和时间时可用的替换符号 %a 输出当前是星期几的英文简写 >>> import datetime >&

随机推荐