zoukankan      html  css  js  c++  java
  • 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);
                    }
                }
            }
        });    
    

      

  • 相关阅读:
    BZOJ_3159_决战
    11.19 ~ 11.25训练计划+总结
    BZOJ_1304_[CQOI2009]叶子的染色_树形DP
    BZOJ_1999_[Noip2007]Core树网的核_单调队列+树形DP
    BZOJ_4033_[HAOI2015]树上染色_树形DP
    BZOJ_5338_ [TJOI2018]xor_可持久化trie
    BZOJ_2957_楼房重建_线段树
    BZOJ_3124_[Sdoi2013]直径_树形DP
    BZOJ_4987_Tree_树形DP
    「JOISC 2019 Day2」两个天线(线段树)
  • 原文地址:https://www.cnblogs.com/yigexiaojiangshi/p/9600149.html
Copyright © 2011-2022 走看看