jQuery EasyUI 重写datagrid的datetimebox编辑类型

最新推荐文章于 2023-06-09 10:57:07 发布

转载最新推荐文章于 2023-06-09 10:57:07 发布 · 251 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：https://yq.aliyun.com/articles/629069

文章标签：

#javascript #ViewUI

博客介绍了datagrid的编辑框可设置为datatimebox或datebox，并给出了相关示例。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

datagrid的编辑框可以为datatimebox或者为datebox如下:

示例如下:

{ field: 'makeDate', title: '编制日期', width: 45,
                    editor:{  
                        type:'datebox' ,   
                        options:{  
                            editable:false   
                        }  
                    }
                }

$.extend($.fn.datagrid.defaults.editors, { 
    datebox : {  
        init : function(container, options) {  
            var box = $('<input />').appendTo(container);  
            options.onSelect=function(){
                var val = box.datebox('getValue');
                //执行相关操作
            }
            box.datebox(options); 
            
            return box;  
        },  
        getValue : function(target) {  
            return $(target).datebox('getValue');  
        },  
        setValue : function(target, value) {  
            $(target).datebox('setValue', value); 
        },  
        resize : function(target, width) {  
            var box = $(target);  
            box.datebox('resize', width);  
        },  
        destroy : function(target) {  
            $(target).datebox('destroy');  
        },
    }  
});  

$.extend($.fn.datagrid.defaults.editors, {  
    datetimebox : {  
        init : function(container, options) {  
            var box = $('<input />').appendTo(container);  
            box.datetimebox(options);  
            return box;  
        },  
        getValue : function(target) {  
            return $(target).datetimebox('getValue');  
        },  
        setValue : function(target, value) {  
            $(target).datetimebox('setValue', value); 
        },  
        resize : function(target, width) {  
            var box = $(target);  
            box.datetimebox('resize', width);  
        },  
        destroy : function(target) {  
            $(target).datetimebox('destroy');  
        },
    }  
});