layui table表格上添加日期控件laydate

参考出处:https://www.cnblogs.com/luo1240465012/p/11424130.html

方法:标红的地方是关键,经测试不要 data_field:‘velappr‘ 也能用。

tatable.render({
    id:‘idTest‘
    ,elem: ‘#dict‘
    ,page: true, size:‘sm‘,height: 410
     ,url: ‘demo.json‘ //数据接口
     ,cols: [[ //表头
      {fixed: ‘left‘, toolbar: ‘#barDemo‘, width:100 , align:‘center‘, title:"操作"}
      ,{field:‘plateno‘, width:100,align:‘center‘,title:‘车牌号‘}
      ,{field:‘velappr‘ , width:100, align:‘center‘, title:‘车辆年审‘,event:‘date1‘,data_field:‘velappr‘,style:‘background-color:#fbeef0‘}
      ,{field:‘runappr‘ , width:100, align:‘center‘, title:‘运营证年审‘,event:‘date2‘,data_field:‘runappr‘,style:‘background-color:#fbeef0‘}
    ]]
  });

处理方法:

var field = $(this).data(‘field‘);  //获取当前对象的字段名称,(如:field:‘velappr‘)
laydate.render({   elem: this.firstChild   , show: true //直接显示   , closeStop: this  //这里代表的意思是:点击 this 所在元素阻止关闭事件冒泡。如果不设定,则无法弹出控件  , done: function (value, res) {    data[field] = value; //修改后的值
    obj.update(res); //res的值:{"year":2020,"month":1,"date":7,"hours":0,"minutes":0,"seconds":0}
   }
});

效果图:

原文地址:https://www.cnblogs.com/xi-li/p/12165750.html

时间: 2024-07-30 21:58:07

layui table表格上添加日期控件laydate的相关文章

如何在UIScrollView的xib上添加子控件并添加AutoLayout约束

引言 自从苹果推出了autoLayout之后,作为开发者,深深的体验到了他的便捷之处,再也不用为适配不同屏幕布局UI而烦恼,我们仅仅需要和类关联一个xib文件,想上面放置我们需要的控件xib,并打好其相对于父视图以及同级视图的约束关系,这样我们就做好了不同屏幕的适配.但是奇怪的是UIScrollView上添加子控件,和之前的一样的操作,报的错却很吓人,那是为什么呢? 原因分析 因为UIScrollView想要能滑动的前提是要知道他的ContentSize的大小,我们直接向上面添加约束,他不知道自

js 日期控件laydate使用

官网  http://sentsin.com/layui/laydate/ 1. 下载官网上的压缩包,解压后只需要复制laydate 文件夹到你的项目中; 2. 在页面引入  <script type="text/javascript" src="js/laydate/laydate.js"></script> 3. 在页面添加: <div class="inline layinput"> <input

js 日期控件laydate的使用

官网:http://laydate.layui.com/ API: 使用: 1. 下载官网上的压缩包,解压后复制laydate 文件夹到项目中; 2. 在页面引入 如: <script type="text/javascript" src="js/laydate/laydate.js"></script>: 3. 示例:(日期范围) 4. 运行效果

日期控件laydate

官网  http://sentsin.com/layui/laydate/ 1. 下载官网上的压缩包,解压后只需要复制laydate 文件夹到你的项目中; 2. 在页面引入  <script type="text/javascript" src="js/laydate/laydate.js"></script> 3. 在页面添加: <div class="inline layinput"> <input

介绍Web项目中用到的几款js日历日期控件和js文本编辑框插件

第一款日历日期控件:layDate 官方网站:http://laydate.layui.com/ 第二款日历日期控件:my97 官方网站:http://www.my97.net/ 第三款 文本编辑器控件:CKEditor 官方网站:http://ckeditor.com/ 第四款 文本编辑器控件:KindEditor 官方网址:http://kindeditor.net/demo.php 第五款 文本编辑器控件:UEditor 官方网址:http://ueditor.baidu.com/webs

UIalertController日期控件

效果图 思路是依靠 UIalertController的高度是由内容判定,修改其view 即可 首先不需要改变该类的初始化(因为只是修改其view的界面) 继承UIalertController的.h文件 #import <UIKit/UIKit.h> typedef void(^BlockDate)(id date); @interface SheetDate : UIAlertController @property(nonatomic,copy)BlockDate blockDate;

UI自动化之特殊处理三(日期控件\表格\富文本)

日期控件\表格\富文本也是一些常遇到的需要特殊处理的定位 目录 1.日期控件 2.表格 3.富文本 1.日期控件 第一种:输入框属性为:readonly="readonly" # 去掉元素的 readonly 属性 js ='document.getElementById("date").removeAttribute("readonly");' driver.execute_script(js) # 用 js 方法输入日期 js_value =

为jEasyUi的日期控件添加一个“清空”按钮----通过修改1.4的easyui.min.js

为 jQuery EasyUI 1.4 的datebox或datetimebox添加一个清空按钮 使用场景:为用户指定了日期的格式,且日期可以为空 修改语言包easyui-lang-zh_CN.js 在if ($.fn.datebox){ 的下一行添加 (41或42行) $.fn.datebox.defaults.cleanText = '清空'; 在if ($.fn.datetimebox && $.fn.datebox){  $.extend($.fn.datetimebox.defa

mui 时间日期控件(浏览器上无法查看,在手机端可以点击)

<head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" /> <title></title> <link href="css/mui.mi