<!DOCTYPE html>

<html>

    <head>

        <title></title>

        <link href="./bootstrap/css/bootstrap.min.css" rel="stylesheet" media="screen">

        <link href="../css/bootstrap-datetimepicker.min.css" rel="stylesheet" media="screen">

    </head>

    <body>

        <div class="container">

            <form action="" class="form-horizontal" role="form">

                <fieldset>

                    <legend>Test</legend>

                    <div class="form-group">

                        <label for="dtp_input1" class="col-md-2 control-label">DateTime Picking</label>

                        <div class="input-group date form_datetime col-md-5" data-date="1979-09-16T05:25:07Z" data-date-format="dd MM yyyy - HH:ii p" data-link-field="dtp_input1">

                            <input class="form-control" size="" type="text" value="" readonly>

                            <span class="input-group-addon"><span class="glyphicon glyphicon-remove"></span></span>

                            <span class="input-group-addon"><span class="glyphicon glyphicon-th"></span></span>

                        </div>

                        <input type="hidden" id="dtp_input1" value="" /><br/>

                    </div>

                    <div class="form-group">

                        <label for="dtp_input2" class="col-md-2 control-label">Date Picking</label>

                        <div class="input-group date form_date col-md-5" data-date="" data-date-format="mm/yyyy" data-link-field="dtp_input2">

                            <input class="form-control" size="" type="text" value="" readonly>

                            <span class="input-group-addon"><span class="glyphicon glyphicon-remove"></span></span>

                            <span class="input-group-addon"><span class="glyphicon glyphicon-calendar"></span></span>

                        </div>

                        <input type="hidden" id="dtp_input2" value="" /><br/>

                    </div>

                    <div class="form-group">

                        <label for="dtp_input3" class="col-md-2 control-label">Time Picking</label>

                        <div class="input-group date form_time col-md-5" data-date="" data-date-format="hh:ii" data-link-field="dtp_input3" data-link-format="hh:ii">

                            <input class="form-control" size="" type="text" value="" readonly>

                            <span class="input-group-addon"><span class="glyphicon glyphicon-remove"></span></span>

                            <span class="input-group-addon"><span class="glyphicon glyphicon-time"></span></span>

                        </div>

                        <input type="hidden" id="dtp_input3" value="" /><br/>

                    </div>

                </fieldset>

            </form>

        </div>

        <script type="text/javascript" src="./jquery/jquery-1.8.3.min.js" charset="UTF-8"></script>

        <script type="text/javascript" src="./bootstrap/js/bootstrap.min.js"></script>

        <script type="text/javascript" src="../js/bootstrap-datetimepicker.js" charset="UTF-8"></script>

        <script type="text/javascript" src="../js/locales/bootstrap-datetimepicker.fr.js" charset="UTF-8"></script>

        <script type="text/javascript">

            $('.form_datetime').datetimepicker({

                //language:  'fr',

                weekStart: ,

                todayBtn: ,

                autoclose: ,

                todayHighlight: ,

                startView: ,

                forceParse: ,

                showMeridian:

            });

            $('.form_date').datetimepicker({

                language: 'fr',

                weekStart: ,

                todayBtn: ,

                autoclose: ,

                todayHighlight: ,

                startView: 'year',

                minView: 'year',

                maxView: 'decade',

                forceParse:

            });

            $('.form_time').datetimepicker({

                language: 'fr',

                weekStart: ,

                todayBtn: ,

                autoclose: ,

                todayHighlight: ,

                startView: ,

                minView: ,

                maxView: ,

                forceParse:

            });

        </script>

    </body>

</html>

datetimepicker的更多相关文章

  1. Bootstap datetimepicker报错TypeError: intermediate value

    Bootstrap datetimepicker有多个版本,官方的链接中,只是datepicker,没有时间的选择,原版的datetimepicker也不再更新,不能用新版的jquery.现在http ...

  2. jQuery DateTimePicker 日期和时间插件

    jQuery UI很强大,其中的日期选择插件Datepicker是一个配置灵活的插件,我们可以自定义其展示方式,包括日期格式.语言.限制选择日期范围.添加相关按钮以及其它导航等. 日期选择插件是一个配 ...

  3. jQuery DateTimePicker 日期控件

    在线实例 实例演示 使用方法 <input id="datetimepicker" type="text" > 复制 $('#datetimepic ...

  4. 物联网平台设计心得：DateTimePicker实现选择联动

    所谓的选择联动,就是指,当我DateTimePicker1选择2月4号的时候,我DateTimePicker2只能选择2月4号和2月5号两天,当然你可以自行规定要选择的日期.这在一些图表查询条件里面是 ...

  5. 在asp.net mvc4项目里bootstrap datetimepicker控件的使用

    前段时间写了一篇关于调用阿里大于的短信接口来开发例会短信群发通知功能的文章http://www.cnblogs.com/zhouyuangan/p/apicall_1.html,其中的例会时间是需求中 ...

  6. DateTimePicker如何与Delphi自带Style同步

    Delphi 的 DateTimePicker 组件有一个CalColors属性,可以设置 DropDown 打开的日历节目的风格.但如果不使用 Delphi 自带的 Style,在这里设置属性看不到 ...

  7. 一款基于bootstrap的datetimepicker

    <!DOCTYPE HTML> <html> <head> <link href="http://netdna.bootstrapcdn.com/t ...

  8. datetimepicker一个不错的日历android特效

    datetimepicker一个不错的日历效,选中和选择日历效果都很不错, 实用的时候直接可以把datetimepicker-library这个引入到项目,调用的地方在实现 TimePickerDia ...

  9. 注意：DateTimePicker.Text不靠谱

    这鸟属性把我害苦过,特此敬告一下大家.具体表现在: 获取时:在DateTimePicker.ValueChanged事件中,获取到的Text有可能是string.Empty!!!,特别当ValueCh ...

  10. web 前端常用组件【04】Datetimepicker 和 Lodop

    web项目中日期选择器和打印这两个功能是非常常见,将使用过的日期和打印控件,在这里总结归纳,为方便后面使用. 1.Datetimepicker a.官方API:http://www.bootcss.c ...

随机推荐

  1. python3连接Mongodb

    前提条件,安装过Mongondb,并且装一下Robomongo(为了更加直观地看到测试时数据的变化 ) 1.安装PyMySQL pip install pymongo 2.测试 import pymo ...

  2. Eclipse Spring Tool Suite插件安装

    目录 Eclipse Spring Tool Suite插件安装 Eclipse Spring Tool Suite插件安装 1.登录网址:http://spring.io/tools/sts/all ...

  3. mysql 数据库表名大小写问题

    lower_case_table_names=1 原来Linux下的MySQL默认是区分表名大小写的,通过如下设置,可以让MySQL不区分表名大小写:1.用root登录,修改 /usr/my.cnf: ...

  4. window.location.href = window.location.href window.location.reload()

    w 0-会议预订提交了预订日期,预订成功后默认显示仅显示当前日期的新页面若显示预定日的信息,则可以对预定日存入cookie: http://stackoverflow.com/questions/24 ...

  5. Python菜鸟之路：Django 文件上传的几种方式

    方式一:通过form表单中,html input 标签的“file”完成 # 前端代码uoload.html <form method="post" action=" ...

  6. 转！！Java的三种代理模式

    转自 http://www.cnblogs.com/cenyu/p/6289209.html 1.代理模式 代理(Proxy)是一种设计模式,提供了对目标对象另外的访问方式;即通过代理对象访问目标对象 ...

  7. Spring-Spring IoC容器

    IoC容器 Spring容器是Spring框架的核心.容器将创建对象,把它们连接在一起,配置它们,并管理它们的整个生命周期从创建到销毁.Spring容器使用依赖注入(DI)来管理组成一个应用程序的组件 ...

  8. Java实现八大排序之冒泡排序

    冒泡排序 冒泡排序的定义: 冒泡排序(Bubble Sort)它重复地走访过要排序的数列,一次比较两个元素,如果他们的顺序错误就把他们交换过来.走访数列的工作是重复地进行直到没有再需要交换,也就是说该 ...

  9. 初识ambari

    本文地址:http://www.cnblogs.com/qiaoyihang/p/6290467.html 引用:http://blog.csdn.net/yeruby/article/details ...

  10. 图形数据库 Neo4j 开发实战【转载】

    简介: Neo4j 是一个高性能的 NoSQL 图形数据库.Neo4j 使用图(graph)相关的概念来描述数据模型,把数据保存为图中的节点以及节点之间的关系.很多应用中数据之间的关系,可以很直接地使 ...