$.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 加清空图标的更多相关文章

  1. easy-ui grid里的toobar按钮隐藏与显示

    //隐藏第一个按钮$('div.datagrid-toolbar a').eq(0).hide();//隐藏第一条分隔线$('div.datagrid-toolbar div').eq(0).hide ...

  2. ligerui_实际项目_003:form中添加数据,表格(grid)里面显示,最后将表格(grid)里的数据提交到servlet

    实现效果: "Form"中填写数据,向本页"Grid"中添加数据,转换成Json数据提交,计算总和,Grid文本框可编辑,排序 图片效果: 总结: //disp ...

  3. easyui grid 增加合计行

    一.首先,easyui  grid 的 showfooter 属性设置为 true $aplgrid.datagrid({ data: globalExpenseClaimForm.ExpenseCl ...

  4. 问题-[Delphi]在对GRID设置单击为编辑时,其他GRID可以,但有一个GRID不行?

    问题现象:在对GRID设置单击为编辑时,其他GRID可以,但有一个GRID不行?问题原因:在这个GRID中的单击事件可能不存在,可以测试一下有没有单击事件.解决方法:需要在GRID的上一个类中,放开单 ...

  5. jQuery EasyUI动态添加控件或者ajax加载页面后不能自动渲染问题的解决方法

    博客分类: jquery-easyui jQueryAjax框架HTML  现象: AJAX返回的html无法做到自动渲染为EasyUI的样式.比如:class="easyui-layout ...

  6. easyui datagrid里的复选框置灰方法

    easyui datagrid里的复选框置灰方法: $('.datagrid input').prop('disabled',true);//复选框置灰

  7. EasyUI datagrid 明细表格中编辑框 事件绑定 及灵活计算 可根据此思路 扩展其他

    原创 : EasyUI datagrid 明细表格中编辑框 事件绑定 及灵活计算 可根据此思路 扩展其他 转载,请注明出处哦!谢谢! 原创 : EasyUI datagrid 明细表格中编辑框 事件绑 ...

  8. easyui grid 本地做分页

    背景: 有的数据不是很多,但是有分页的需求,这个时候后台往往没有做分页,我们是一次请求了所有的数据. 代码: dataSource 为 grid 里的数据源 html部分: <table id= ...

  9. ExtJs 日期相加,Grid表格列可编辑

    1.日期相加: Ext.Date.add(new Date(), Ext.Date.DAY, 15) 2.Grid表格列可编辑: {    header : "实际已交货量",   ...

随机推荐

  1. Nodejs连接数据库为何使用连接池

    问题一.nodejs既然是单线程运行,在连接数据库时为何要使用连接池呢? 问题二,redis服务端是单线程运行的,使用连接池到redis,服务端还是串行处理,有什么意义么? 这两个问题都涉及到单线程与 ...

  2. js中一切都是对象

    <script> function cat(){} var cat = new cat(); console.log(cat.constructor) console.log(typeof ...

  3. 浅谈SLAM的回环检测技术

    什么是回环检测? 在讲解回环检测前,我们先来了解下回环的概念.在视觉SLAM问题中,位姿的估计往往是一个递推的过程,即由上一帧位姿解算当前帧位姿,因此其中的误差便这样一帧一帧的传递下去,也就是我们所说 ...

  4. 高阶篇:4.1)QFD质量功能展开-总章

    本章目的:了解QFD概念和作用,为FMEA打下基础. 1.QFD定义 质量功能展开QFD(Quality Function Deployment),是把顾客或市场的要求转化为设计要求.零部件特性.工艺 ...

  5. SQL数据库Replace的用法

    关于数据库Replace的用法:Replace("字符串","要被替代的字符串","替代后的字符串")尝试过写法效果如下->修改前 效 ...

  6. php 图片上传 并返回上传文件位置 支持多文件上传

    <?php /** * Created by PhpStorm. * User: DY040 * Date: 2018/4/26 * Time: 13:23 */ echo '<pre&g ...

  7. SpringBoot中使用Jackson导致Long型数据精度丢失问题

    数据库中有一个bigint类型数据,对应java后台类型为Long型,在某个查询页面中碰到了问题:页面上显示的数据和数据库中的数据不一致.例如数据库中存储的是:1475797674679549851, ...

  8. java email

    package email; import java.io.File;import java.util.Date;import java.util.Properties; import javax.a ...

  9. lucene原理

    lucene查找原理: https://yq.aliyun.com/articles/581877

  10. (转)linux内存源码分析 - 内存回收(lru链表)

    原文:http://www.cnblogs.com/tolimit/p/5447448.html 概述 对于整个内存回收来说,lru链表是关键中的关键,实际上整个内存回收,做的事情就是处理lru链表的 ...