easyUI的时间控件

以前没怎么用过easyUI，今天用到时间控件，又了解到了一点东西：在页面中通过js添加控件，需要主动渲染。
时间控件的样式

 <input class="easyui-datetimebox" id="starttime" name="starttime" style="width:150px" />

然后通过js 动态的添加的时候，使用append添加

container.append('开始时间< input class="easyui-datetimebox" id="starttime" name="starttime" style="width:150px" />');

在页面只是一个文本框，右侧不显示选择时间的小按钮，控件不能加载
查询的得知，easyUI属性的加载是在渲染页面的时候完成，当页面渲染完成之后，通过js动态调用再添加的easyUI的控件就不再起效果，需要手动的进行加载，于是添加：

$.parser.parse(container);

这样就可以将新添加了easyui-datetimebox属性加载到页面

但是在获取数据的时候又出现问题，通过id无法获取值，通过调试得到，时间控件会生成一个隐藏域，里面是选择的时间，但是这个隐藏域里没有id属性，但是有name属性，于是使用name可以获取值

$("input[name='starttime']").val()

于是通过：

container.append('开始时间<input class="easyui-datetimebox" id="starttime" name="starttime" style="width:150px" />');
container.append('结束时间<input class="easyui-datetimebox" id="endtime" name="endtime" style="width:150px" />');
$.parser.parse(container);

效果如下：

查看具体的值存放：

可以看到，选择的时间“2017-12-26 13:45:03”没有显示在自己定义的input标签里，而是在easyUI自己生产的一个隐藏域里面。

easyUI的时间控件相关推荐

easyui datebox时间控件改为年月视图,值也为年月
效果图 <span>聘任年度:</span><input id="search-prnd" class="easyui-datebox&qu ...
easyui datebox时间控件如何只显示年月
easyui datebox控件,只显示年月,不显示年月日需要的效果图如下: 具体的js代码: <script>$(function(){intiMonthBox('costTime') ...
关于EasyUI DataGrid行编辑时嵌入时间控件
本人做一个名为"安徽中控"项目时,为快速开发基础数据增删改模块,遂采用EasyUIDatagrid将所有增删改查的操作都集中于表格中,并且所有增删改查操作都集中于泛型对象,从而不必 ...
EasyUI年-月日期格式的日期时间控件+行内编辑的年-月日期格式的日期时间控件
一.input标签下的easyui-datebox的年月时间格式 1.标签代码 <label style="font-size: 14px;font-family: Microsoft ...
angularjs 整合bootstrap 时间控件
一.引入js <link href="${basePath}/static/plugin/bootstrap/css/bootstrap-datetimepicker.min.css& ...
记一次重写easyui的datetimebox控件的小片段
因为项目中服务器使用UTC时间,而easyui的datetimebox点击今天获取的是本地时间,存在时差.所以扩展了easyui的datetimebox控件,具体如下: easyui官方的dateti ...
（转）基于MVC4+EasyUI的Web开发框架经验总结（2）- 使用EasyUI的树控件构建Web界面...
http://www.cnblogs.com/wuhuacong/p/3669575.html 最近花了不少时间在重构和进一步提炼我的Web开发框架上,力求在用户体验和界面设计方面,和Winform开 ...
bootstrap-datetimepicker时间控件添加清除按钮
本文转自:https://blog.csdn.net/gyysmile/article/details/80226993 其实这位大神写的很好了,为什么我还要在写呢,因为我想写点东西了最近测试部提出 ...
python日历gui_python GUI库图形界面开发之PyQt5日期时间控件QDateTimeEdit详细使用方法与实例...
PyQt5日期时间控件QDateTimeEdit介绍 QDateTimeEdit是一个允许用户编辑日期时间的控件,可以使用键盘上的上下键头按钮来增加或减少日期的时间值,QDateTimeEdit通过s ...
robotframe使用之时间控件
robotframe使用之时间控件正常的页面,时间控件会写在一个iframe里面,所以robotframework找不到对的ID或者xpath等. 要解决这个问题必选先显示iframe. 使用关键字 ...

easyUI的时间控件

easyUI的时间控件相关推荐

最新文章

热门文章