datepicker:

https://github.com/2amigos/yii2-date-picker-widget

通过composer安装:

composer require 2amigos/yii2-date-picker-widget:~1.0

使用方法:

<?php
use dosamigos\datepicker\DatePicker; // as a widget
?> <?= DatePicker::widget([
'model' => $model,
'attribute' => 'date',
'template' => '{addon}{input}',
'clientOptions' => [
'autoclose' => true,
'format' => 'dd-M-yyyy'
]
]);?> <?php
// with an ActiveForm instance
?>
<?= $form->field($model, 'date')->widget(
DatePicker::className(), [
// inline too, not bad
'inline' => true,
// modify template for custom rendering
'template' => '<div class="well well-sm" style="background-color: #fff; width:250px">{input}</div>',
'clientOptions' => [
'autoclose' => true,
'format' => 'dd-M-yyyy'
]
]);?>

datetimepicker:

http://www.yiiframework.com/extension/yii2-datetimepicker-widget/

通过composer安装:

php composer.phar require "2amigos/yii2-date-time-picker-widget" "*"

使用方法:

<?php
use dosamigos\datetimepicker\DateTimePicker;
// as a widget
?>
<?= DateTimePicker::widget([
'model' => $model,
'attribute' => 'created_at',
'language' => 'es',
'size' => 'ms',
'clientOptions' => [
'autoclose' => true,
'format' => 'dd MM yyyy - HH:ii P',
'todayBtn' => true
]
]);?>
<?= DateTimePicker::widget([
'id' => 'test1',
'name' => 'test1',//当没有设置model时和attribute时必须设置name
'language' => 'es',
'size' => 'ms',
'clientOptions' => [
'autoclose' => true,
'format' => 'dd MM yyyy - HH:ii P',
'todayBtn' => true
]
]);?> <?php
// with an ActiveForm instance displayed as a TimePicker
use dosamigos\datetimepicker\DateTimePicker;
?>
<?= $form->field($tour, 'date_from')->widget(DateTimePicker::className(), [
'language' => 'es',
'size' => 'ms',
'template' => '{input}',
'pickButtonIcon' => 'glyphicon glyphicon-time',
'inline' => true,
'clientOptions' => [
'startView' => 1,
'minView' => 0,
'maxView' => 1,
'autoclose' => true,
'linkFormat' => 'HH:ii P', // if inline = true
// 'format' => 'HH:ii P', // if inline = false
'todayBtn' => true
]
]);?>

版权声明:本文为博主原创文章,未经博主允许不得转载。

yii2-datepicker/datetimepicker插件使用的更多相关文章

  1. 1、用datetimepicker插件实现限定时间范围的选择 2、时间插件实现默认当天的时间和只能选择小于今天的日期

    一.用datetimepicker插件实现限定时间范围的选择 1.下面是要实现的效果图,让开始时间只能从  2018-7-1  到 2018-7-7 选择. 2.html的结构 <div cla ...

  2. 使用jQuery的datetimepicker插件

    因为后台系统要使用年月日时分的设置,又因为使用的Bootstrap框架只有datepicker和timepicker控件.所以在jQuery库中找到轻量级的datetimepicker插件,很好地解决 ...

  3. 使用datepicker日期插件

    使用datepicker日期插件 在引入<jquery.js> <bootstrap.js><datepicker.js>之后 引用<bootstrap.cs ...

  4. [转]jQueryUI中Datepicker(日历)插件的介绍和使用

    http://jqueryui.com/datepicker/ 本文转自:http://blog.csdn.net/redarmy_chen/article/details/7400571 jQuer ...

  5. bootstrp的datetimepicker插件获取选定日期

    碰到一个日期选择,并将日期存储到数据库的需求,需要利用bootstrp的datetimepicker插件获取选定日期,并将其转换为指定字符窜,简单记录下实现的过程. 1. datetimepicker ...

  6. bootsctrap4 datepicker时间选择插件

    现在网上基本都是v3的时间选择插件,花了点时间改了找了个v4能用的 bootstrap-datepicker <!DOCTYPE html> <html> <head&g ...

  7. jQuery UI Datepicker&Datetimepicker添加 时-分-秒 并且,判断

    jQuery UI Datepicker时间(年-月-日) 相关代码: <input type="text" value="" name="ad ...

  8. Jquery datepicker 时间插件使用 js 时间相加,相减

    $(document).ready(function(){ //输入框事件 $('#probation').bind('input propertychange', function() { var ...

  9. 常见问题:bootstrap datepicker日期插件汉化

    引入简体中文js(bootstrap-datepicker.zh-CN.js),并在datepicker属性配置language为‘zh-CN’即可,示例如下: $(".form_datet ...

随机推荐

  1. (转)java线程安全问题之静态变量、实例变量、局部变量

    java多线程编程中,存在很多线程安全问题,至于什么是线程安全呢,给出一个通俗易懂的概念还是蛮难的,如同<java并发编程实践>中所说: 写道 给线程安全下定义比较困难.存在很多种定义,如 ...

  2. IO流认识

    处理流是“连接”在已存在的流(节点流或处理流)之上,通过对数据的处理为程序提供更强大的读写能力.  BufferedWriter/BufferedReader(缓冲流)是处理流中的一种 OutputS ...

  3. 在JS函数中执行C#中的函数、字段

    1.调用字段 cs文件的代码: ; protected void Page_Load(object sender, EventArgs e) { id = ; } js页面的代码: function ...

  4. Obj格式解析以及在Unity3D下导入测试

    目前基本实现了导入,注意只能打开含有单个模型的obj文件 四边面模型: 全三角面模型(测试单一材质,自动分了下UV): 这里介绍下obj格式: obj格式是waveFront推出的一种3D模型格式,可 ...

  5. Poj(1469),二分图最大匹配

    题目链接:http://poj.org/problem?id=1469 COURSES Time Limit: 1000MS   Memory Limit: 10000K Total Submissi ...

  6. Wampserver3.0.0设置语言为中文无效

    打开配置文件"wampmanager.conf",将language改成chinese,再从右键的语言选择中选中文. 这个配置文件有两个,改第一个双引号里的,第二个没有引号的不要改 ...

  7. [Emacs] 常用快捷键-- 生存指南

    Emacs 常用快捷键--生存指南 主要用来记录自己常用到的快捷键,记住这些快捷键可以保证你在Emacs中生存. 有可能不全,但是够用了(简单写文本). 保存和退出 使用 C-x C-s 保存文件. ...

  8. Solr开发文档

    转载:http://www.cnblogs.com/hoojo/archive/2011/10/21/2220431.html Solr 是一种可供企业使用的.基于 Lucene 的搜索服务器,它支持 ...

  9. #ifdef _DEBUG

    #ifdef _DEBUG virtual void AssertValid() const; //assert(断言)valid(有效的,正确的) virtual void Dump(CDumpCo ...

  10. sql 百万级数据库优化方案

    转自http://blog.sina.com.cn/s/blog_724cd89d0100ppcz.html 1.对查询进行优化,应尽量避免全表扫描,首先应考虑在 where 及 order by 涉 ...