如图所示效果:年—月—日 时—分—秒

<tr>
                <td align="center" style="background-color: #cccccc">
                    出机时间:</td>
                <td style="padding-left: 5px; background-color: #ffffff" class="style2">
                    <asp:TextBox ID="txtChuDate" runat="server"  Width="34%" onclick="WdatePicker({el:'txtDate',dateFmt:'yyyy-MM-dd HH:mm',onpicked:PickedFunc})"></asp:TextBox>
                    <asp:TextBox ID="txtChuHour" runat="server"  Width="12%"></asp:TextBox>:
                    <asp:TextBox ID="txtChuMin" runat="server"  Width="12%"></asp:TextBox>
                    <asp:TextBox ID="txtDate" runat="server"    Width="10%" style=" display:none"></asp:TextBox>
                    <img align="absmiddle" height="22"  onclick="WdatePicker({el:'txtDate',dateFmt:'yyyy-MM-dd HH:mm',onpicked:PickedFunc})" src="../My97DatePicker/skin/datePicker.gif" width="16" /></td>
                <td style="padding-left: 5px; height: 25px; background-color: #ffffff">
                    &nbsp;</td>
            </tr>
            <tr>
                <td align="center" style="height: 25px; background-color: #cccccc">
                    回机时间:</td>
                <td style="padding-left: 5px; background-color: #ffffff" class="style2">
                    <asp:TextBox ID="txtHuiDate" runat="server"  Width="34%"  onclick="WdatePicker({el:'txtDate',dateFmt:'yyyy-MM-dd HH:mm',onpicked:PickedFunc2})"></asp:TextBox>
                    <asp:TextBox ID="txtHuiHour" runat="server"  Width="12%"></asp:TextBox>:
                    <asp:TextBox ID="txtHuiMin" runat="server"  Width="12%"></asp:TextBox>
                    <asp:TextBox ID="txtDate2" runat="server"    Width="10%" style=" display:none"></asp:TextBox>
                    <img align="absmiddle" height="22" onclick="WdatePicker({el:'txtDate',dateFmt:'yyyy-MM-dd HH:mm',onpicked:PickedFunc2})"src="../My97DatePicker/skin/datePicker.gif" width="16" /></td>
                <td style="padding-left: 5px; height: 25px; background-color: #ffffff">
                    &nbsp;</td>
            </tr>

javascript操作Onpicked:PickedFunc代码

<script  type="text/javascript">
            function PickedFunc(){
            $dp.$('txtChuDate').value=$dp.cal.getP('y')+"-"+$dp.cal.getP('M')+"-"+$dp.cal.getP('d');
            $dp.$('txtChuHour').value=$dp.cal.getP('H');
            $dp.$('txtChuMin').value=$dp.cal.getP('m');
                               }
                                function PickedFunc2(){
            $dp.$('txtHuiDate').value=$dp.cal.getP('y')+"-"+$dp.cal.getP('M')+"-"+$dp.cal.getP('d');
            $dp.$('txtHuiHour').value=$dp.cal.getP('H');
            $dp.$('txtHuiMin').value=$dp.cal.getP('m');
                               }
</script>

注意:el:'txtDate'中,如果你不需要'txtDate'这个框,你可以把他隐藏,但是el属性必须指定
$dp.$和$dp.cal.getP都是内置函数

<asp:TextBox ID="txtDate" runat="server"    Width="10%" style=" display:none"></asp:TextBox>

将这个TextBox的style display属性设置为隐藏就可得到每个数据。

两个输入框联动:

第一个日期选中后自动填充到第二个日期框中

在等一个输入框的点击事件function PickedFunc() 中加入如下代码将第一个输入框中选择的val()赋值给第二个框的所有

{if ($("input[id$='txtHuiDate']").val() == "") {
                $("input[id$='txtHuiDate']").val($("input[id$='txtChuDate']").val());
                $("input[id$='txtHuiHour']").val($("input[id$='txtChuHour']").val());
                $("input[id$='txtHuiMin']").val($("input[id$='txtChuMin']").val());

MyDatePicker拆分日期显示到不同TextBox的更多相关文章

  1. iOS不得姐项目--精华模块上拉下拉的注意事项,日期显示,重构子控制器,计算cell的高度(只计算一次),图片帖子的显示

    一.上拉下拉注意事项 使用MJRefresh中的上拉控件自动设置透明 当请求下页数据通过page的时候,注意的是上拉加载更多数据失败的问题,下拉加载数据失败了,页数应该还原.或者是请求成功的时候再将页 ...

  2. ios日期显示NaN

    ios中js通过getMonth()获取到的日期显示NaN,而在其他地方如pc.安卓都是ok的,这是为什么呢,原来这里有个ios的兼容问题,需要将日期中的“-”替换为“/” var time = ne ...

  3. SilverLight:基础控件使用(4)-日期显示和选择类控件

    ylbtech-SilverLight-Basic-Control:基础控件使用(4)-日期显示和选择类控件 Calendar,DatePicker 1.A,返回顶部 Calendar控件(日期控件) ...

  4. HTML5验证及日期显示

    以前忽略了HTML5的强大功能,谁知有了它数据大部分都不需要自己验证,显示日历也不需要插件啦,一些小功能分享给大家 1.Email输入框,自动验证Email有效性. <!DOCTYPE HTML ...

  5. Highcharts使用=====通过指定日期显示曲线

    1.说明: 利用HighStock显示曲线,在右上角的日期间隔选择好日期后,重新请求后台数据,重新加载曲线. 2.实现方法: 在HighStock的rangeSelector中有一个属性inputDa ...

  6. 对Spring from中日期显示格式化问题

    开始时间 结束时间 保存 取消 想在input中让日期格式显示为HH:ss 但是各种百度没有找到答案 最后Google之 http://stackoverflow.com/questions/1173 ...

  7. js实现日期显示的一些操作

    1.js获取当前日期(yyyy-mm-dd) 以下代码是获取到的当前日期: var myDate = new Date(); var year = myDate.getFullYear(); //获取 ...

  8. MFC日期显示

    一.使用MFC的CTime类来得到时间: CTime必须调用赋值函数,使用其静态函数来初始化 例如: CTime time=CTime::GetCurrentTime(): 这样就可以直接调用time ...

  9. TOAD和PLSQL 默认日期显示、rowid显示、TNSNAME的修改

    先说下要解决的问题: select rowid,acct_id,state_date from acct; 修改后,1)sql指明rowid,可以显示出来 2)时间格式显示为YYYYMMDD HH24 ...

随机推荐

  1. perl 一个简单的面向对象的例子

    <pre name="code" class="python">[root@wx03 wx]# cat x1.pm package x1; use ...

  2. Mobile Service更新和 Notification Hub 对Android的支持

    本周,我们要推出一些更新,使移动服务成为移动应用程序更强大.更灵活的后端,同时推出一个与移动服务或网站结合使用的免费 20MB SQL 数据库,并且将支持通过Notification Hub中的 GC ...

  3. 字符编码知识:Unicode、UTF-8、ASCII、GB2312等编码之间是如何转换的?

    转自:  http://apps.hi.baidu.com/share/detail/17798660 字符编码是计算机技术的基石,想要熟练使用计算机,就必须懂得字符编码的知识.不注意的人可能对这个不 ...

  4. java 书籍推荐 JavaEE程序员必读图书大推荐

    java 书籍推荐 JavaEE程序员必读图书大推荐 转自:http://www.cnblogs.com/xlwmin/articles/2192775.html 下面是我根据多年的阅读和实践经验,给 ...

  5. 关于chrome浏览器更新后快捷工具失效的解决方法

    更新chrome浏览器到29.0时发现快捷工具的双击关闭标签页失效了,解决办法: 1.打开chrome的文件夹.C:\Program Files (x86)\Google\Chrome\Applica ...

  6. makefile编写差异

    由于zlib动态库在linux下引用的问题引出了对于简练的makefile的学习.之前通过看网络上的一些文章自己也算简单了解如何编写一个makefile,可总是不那么美观,今天经过辉哥的指点,对于ma ...

  7. Struts2 使用通配符动态请求Action

    在以前的学习中,<action>元素的配置,都是用明确的配置,其name.class等属性都是一个明确的值.其实Struts2还支持class属性和method属性使用来自name属性的通 ...

  8. hdu 5578 Friendship of Frog(multiset的应用)

    Problem Description N frogs . Two frogs are friends if they come from the same country. The closest ...

  9. uva 10051 Tower of Cubes(DAG最长路)

    题目连接:10051 - Tower of Cubes 题目大意:有n个正方体,从序号1~n, 对应的每个立方体的6个面分别有它的颜色(用数字给出),现在想要将立方体堆成塔,并且上面的立方体的序号要小 ...

  10. HDU1506_Largest Rectangle in a Histogram

    Largest Rectangle in a Histogram Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 ...