easyui grid 里的可编辑text 加清空图标
$.extend($.fn.datagrid.defaults.editors, {
text: {
init: function (container, options) {
var _opt = $('<input type="text" class="datagrid-editable-input">');
var curField = container.prevObject.prevObject.attr('field');
if (curField == "我们需要加清空的字段" ) {
var button = $('<input type="text" class="easyui-textbox"> ').appendTo(container);
button.textbox({
//添加清除图标
icons: [{
iconCls: 'icon-clear',
handler: function (e) {
button.textbox('clear');
//modelTextClear 是自定义清除 grid 里数据 的函数
modelTextClear(curField);
}
}]
});
if (typeof (options.onClick) == 'function') {
var el = button.next().children('.textbox-text');
el.click(function () {
options.onClick(el);
});
}
return button;
}
if (typeof (options.onChange) == 'function') {
_opt.change(function () {
options.onChange(_opt);
});
}
if (typeof (options.onFocus) == 'function') {
_opt.focus(function () {
options.onFocus(_opt);
});
}
if (typeof (options.onKeyup) == 'function') {
_opt.keyup(function () {
options.onKeyup(_opt);
});
}
var input = _opt.appendTo(container);
if (container.closest('td[field]').attr('field') == 'ApplyDate') {
_opt.addClass('form-control');
return input.datetimepicker({
minView: "month", //选择日期后,不会再跳转去选择时分秒
format: "yyyy-mm-dd", //选择日期后,文本框显示的日期格式
language: 'zh-CN', //汉化
autoclose: true
});
}else {
return input;
}
},
destroy: function (target) {
$(target).remove();
},
getValue: function (target) {
return $(target).val();
},
setValue: function (target, value) {
$(target).val(value);
},
resize: function (target, width) {
$(target)._outerWidth(width);
//以下是处理图标不显示的问题 因为span 占满了单元格
var curField = target.closest('[field]').attr('field');
if (curField == "ReimbursementID" || curField == "CostCenterDisplayName" || curField == "ProductDisplayName") {
target.next('.textbox').css('width', width);
target.next().children('.textbox-text').css('width', width - 26);
}
}
}
});
easyui grid 里的可编辑text 加清空图标的更多相关文章
- easy-ui grid里的toobar按钮隐藏与显示
//隐藏第一个按钮$('div.datagrid-toolbar a').eq(0).hide();//隐藏第一条分隔线$('div.datagrid-toolbar div').eq(0).hide ...
- ligerui_实际项目_003:form中添加数据,表格(grid)里面显示,最后将表格(grid)里的数据提交到servlet
实现效果: "Form"中填写数据,向本页"Grid"中添加数据,转换成Json数据提交,计算总和,Grid文本框可编辑,排序 图片效果: 总结: //disp ...
- easyui grid 增加合计行
一.首先,easyui grid 的 showfooter 属性设置为 true $aplgrid.datagrid({ data: globalExpenseClaimForm.ExpenseCl ...
- 问题-[Delphi]在对GRID设置单击为编辑时,其他GRID可以,但有一个GRID不行?
问题现象:在对GRID设置单击为编辑时,其他GRID可以,但有一个GRID不行?问题原因:在这个GRID中的单击事件可能不存在,可以测试一下有没有单击事件.解决方法:需要在GRID的上一个类中,放开单 ...
- jQuery EasyUI动态添加控件或者ajax加载页面后不能自动渲染问题的解决方法
博客分类: jquery-easyui jQueryAjax框架HTML 现象: AJAX返回的html无法做到自动渲染为EasyUI的样式.比如:class="easyui-layout ...
- easyui datagrid里的复选框置灰方法
easyui datagrid里的复选框置灰方法: $('.datagrid input').prop('disabled',true);//复选框置灰
- EasyUI datagrid 明细表格中编辑框 事件绑定 及灵活计算 可根据此思路 扩展其他
原创 : EasyUI datagrid 明细表格中编辑框 事件绑定 及灵活计算 可根据此思路 扩展其他 转载,请注明出处哦!谢谢! 原创 : EasyUI datagrid 明细表格中编辑框 事件绑 ...
- easyui grid 本地做分页
背景: 有的数据不是很多,但是有分页的需求,这个时候后台往往没有做分页,我们是一次请求了所有的数据. 代码: dataSource 为 grid 里的数据源 html部分: <table id= ...
- ExtJs 日期相加,Grid表格列可编辑
1.日期相加: Ext.Date.add(new Date(), Ext.Date.DAY, 15) 2.Grid表格列可编辑: { header : "实际已交货量", ...
随机推荐
- HTML-★★★★★JavaScritp简介与语法★★★★★
简介: 1.什么是JavaScript? 它是个脚本语言,作用是使 HTML 页面具有更强的动态和交互性,它需要有宿主文件,它的宿主文件就是html文件. JavaScript 是 Web 的编程语 ...
- gitlab容器--带https配置
#2.gitlab 重要目录 /home/maks/gitlab/config /etc/gitlab /home/maks/gitlab/logs /var/log/gitlab /home/mak ...
- js 自定义获得类class和获得id
使用js获取类名,但是低版本浏览器不支持getElementsByClassName,所以我们就需要自定义getClassName,方便跨浏览器使用. 当然,如果采用jquery就不需要. //获取类 ...
- WINDOWS SERVER 2012标准版密钥
Windows Server 2012 R2 安装密钥(只适用安装,不支持激活) 标准版 = NB4WH-BBBYV-3MPPC-9RCMV-46XCB MMPXK-NBJDQ-JPM34-WX3FM ...
- 论文阅读 | FCOS: Fully Convolutional One-Stage Object Detection
论文阅读——FCOS: Fully Convolutional One-Stage Object Detection 概述 目前anchor-free大热,从DenseBoxes到CornerNet. ...
- java高并发测试代码
package com.example.test; import java.net.URL;import java.net.URLConnection;import java.util.concurr ...
- 完美解决读取Excel的数字单元格时Cannot get a STRING value from a NUMERIC cell 报错处理
我使用的是Poi(最新的4.1.0)方式读取Excel ,我的方法如下: 在打印cell内容时,抛出下面的错误 Exception in thread "main" java.la ...
- 前端cookie、localStorage、sessionStorage缓存技术总结
转载自:https://www.cnblogs.com/belove8013/p/8134067.html 1.Cookie JavaScript是运行在客户端的脚本,因此一般是不能够设置Sessio ...
- Angular CLI
简介 ng 官方命令行 Angular CLI 自己的官方文档 https://github.com/angular/angular-cli/wiki/new 常用代码 临时代码 ng new ...
- 记一次简单的关于SimpleDateFormat的优化
# 有一个有趣的需求: (1)预先定义每天24小时不同时间段的电价 (2) 有一个list<map<timestamp,value>>: timestamp(时间戳):valu ...