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

使用composer安装 日期插件

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

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

在视图文件中使用下面的代码 :

use dosamigos\datepicker\DatePicker;
<span>开始时间:</span>

//方法一:使用widget方式1

1 <?=DatePicker::widget([
2   'name' => 'jui-start-time',
3   'template' => '{addon}{input}',
4   'clientOptions' => [
5     'autoclose' => true,
6     'format' => 'yyyy-mm-dd'
7   ]
8 ]);?>

//方法二:使用widget方式2

1 <?= DatePicker::widget([
2   'model' => $model,
3   'attribute' => 'date',
4   'template' => '{addon}{input}',
5   'clientOptions' => [
6     'autoclose' => true,
7     'format' => 'yyyy-mm-dd'
8   ]
9 ]);?>

//方法三:ActiveForm方式

 1 <?= $form->field($model, 'date')->widget(
2   DatePicker::className(), [
3   // inline too, not bad
4   'inline' => true,
5   // modify template for custom rendering
6   'template' => '<div class="well well-sm" style="background-color: #fff; width:250px">{input}</div>',
7   'clientOptions' => [
8     'autoclose' => true,
9     'format' => 'yyyy-mm-dd'
10   ]
11 ]);?>

显示:

参考:http://www.qianbo.com.cn/Study/Program/60054.html

二、使用yii2自带的插件

1 <?=\yii\jui\DatePicker::widget([
2 'name' => 'Staff[birthday]',
3 'value' => $model->birthday,
4 'dateFormat' => 'yyyy-MM-dd',
5 'options' => ['placeholder'=>'出生日期', 'class'=>'form-control']
6 ]) ?>

yii2.0使用bootstrap中日期插件的更多相关文章

  1. bootstrap的日期插件datetimepicker有问题

    bootstrap的日期插件datetimepicker在chrome中会出现掉下来的现象,而且一直没找到原因,下载最新版的插件直接在各个浏览器中都会掉下来, 问题一直解决不了,转而换其他插件 htt ...

  2. Bootstrap中DropDown插件显示下拉列表,点击下拉列表区域,不会再自动关闭。

    目标: Bootstrap中DropDown插件显示下拉列表,点击下拉列表区域,不会再自动关闭. 参考:http://v3.bootcss.com/javascript/#dropdowns    / ...

  3. Jquery中日期插件jquery.datepick的使用

    jsp的代码: <%@ page language="java" contentType="text/html; charset=UTF-8" pageE ...

  4. bootstrap datetimepicker 日期插件超详细使用方法

    日期时间选择器 目前,bootstrap有两种日历.datepicker和datetimepicker,后者是前者的拓展. Bootstrap日期和时间组件: 使用示例: 从左到右依次是十年视图.年视 ...

  5. Bootstrap 中的插件的学习2(导航)

    实例 在导航栏内 下面的实例演示了在导航栏内的下拉菜单的用法: <!DOCTYPE HTML> <html> <head> <link href=" ...

  6. Bootstrap 中的插件的学习

    一个静态的模态窗口实例,如下面的实例所示: <!DOCTYPE html> <html> <head> <title>Bootstrap 实例 - 模态 ...

  7. 使用bootstrap的日期插件

    1.  需要用的js包点击下载,在项目中引入该js. <script language="JavaScript" src="${pageContext.reques ...

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

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

  9. Angular4.0引入laydate.js日期插件方法

    Angular是不支持直接引入js文件的,下面介绍项目如果引入laydate.js的方法 一.将下载的laydate中的js和theme文件放到一个统一的文件下面,我把它放到asset下 二.在ang ...

随机推荐

  1. MacOs/Liunx主机搭建windows平台双机调试环境

    0x00 前言 本文的主要试用对象是Mac OS/Linux用户,对于想调试windows内核相关的一些东西时,需要搭建双机调试环境的一些记录.另外对于本机是windows的用户也完全试用,windo ...

  2. JUC---06线程间通信(二)

    二.线程间定制化调用通信 要使多线程之间按顺序调用,实现A->B->C按顺序输出,使用Lock锁实现,通过Lock锁创建三个Condition实例(三把钥匙),通过不同的条件,调用不同钥匙 ...

  3. 使用 Filebeat 对多行日志进行处理(multiline)

    Filebeat 收集日志的过程中,默认是按行收取的,也就是每一行都会默认是一个单独的事件并添加时间戳.但是在收集一些特殊日志的时候,往往一个事件包含有多行,例如 Java 的堆栈跟踪日志: 20-0 ...

  4. 2020 10月CUMTCTF wp

    华为杯 × 签到杯√ 论比赛过程来说没什么很大收获 但看师傅们的wp感触很多 赛后复现慢慢学吧 Web babyflask flask ssti模板注入: payload{{key}}发现[]以及类似 ...

  5. 怎么提高selenium脚本的自动化执行效率?

    1.使用配置更高的电脑,选择更快的网络环境:2.使用效率更高的语言,比如 java 比 python,这种方案可行性不高:3.能直接访问网址的,就不要一步一步点击:4.不要盲目增加 sleep,尽量使 ...

  6. 热部署只知道devtools吗?JRebel不香吗?

    持续原创输出,点击上方蓝字关注我 目录 前言 JRebel收费怎么破? 什么是本地热部署? 什么是远程热部署? JRebel和devtools的区别 如何安装JRebel? 如何本地热部署? 如何远程 ...

  7. Hash 算法与 Manacher 算法

    目录 前言 简单介绍 简述 Hash 冲突 离散化 基本结构 普通 Hash 简述 例题 字符串 Hash 简单介绍 核心思想 基本运算 二维字符串 Hash 例题 兔子与兔子 回文子串的最大长度 后 ...

  8. setTimeout、同步、异步的理解

    console.log('111'); setTimeout(()=>{ console.log('222') },1000); console.log('333'); setTimeout(( ...

  9. 手把手教你使用容器服务 TKE 集群审计排查问题

    概述 有时候,集群资源莫名被删除或修改,有可能是人为误操作,也有可能是某个应用的 bug 或恶意程序调用 apiserver 接口导致,需要找出 "真凶".这时候,我们需要为集群开 ...

  10. PHP无限级评论回复功能实现

    protected function commentList($aid,$pid = 0,&$result=array()){ $arr = ArticleComment::relation( ...