首页 > 代码库 > easyui 日期控件清空值

easyui 日期控件清空值

最近用了Easyui的日期控件datebox,项目中要将选中值清空,于是就研究了一下。

 

     1,调用方法清空

 

[javascript] view plain copy
 
 print?技术分享技术分享
  1. $(‘#yourId‘).combo(‘setText‘,‘‘);  

   

 

     2,更改js文件

     从官网下载的源文件中,datebox控件界面只有‘Today’,‘Close’事件,我们可以把清空选项值的事件添加到js中去,这样,只要引用了datebox这个控件,界面上就会有清空选项。具体修改步骤如下:

     首先在官网上下载jquery.easyui.min.js文件。

     在js文件中找到Today Close事件定义的地方,并添加Clean事件的定义。

   

     源文件说明:技术分享

    

    将源文件12733--12742行文件替换为:

技术分享

  代码:

 

[javascript] view plain copy
 
 print?技术分享技术分享
  1. }},currentText:"Today",cleanText:"Clean",closeText:"Close",okText:"Ok",buttons:[{text:function(_985){  
  2. return $(_985).datebox("options").currentText;  
  3. },handler:function(_986){  
  4. $(_986).datebox("calendar").calendar({year:new Date().getFullYear(),month:new Date().getMonth()+1,current:new Date()});  
  5. _975(_986);  
  6. }},{text:function(_987){  
  7. return $(_987).datebox("options").closeText;  
  8. },handler:function(_988){  
  9. $(this).closest("div.combo-panel").panel("close");  
  10. }},{ text : function(_989) {  
  11.   
  12. return $(_989).datebox("options").cleanText;  
  13.   
  14. },handler : function(_990) {  
  15.   
  16. $(_990).combo(‘setValue‘, ‘‘).combo(‘setText‘, ‘‘);  
  17.   
  18. $(this).closest("div.combo-panel").panel("close");  
  19.   
  20. }}],formatter:function(date){  

 

 

    界面效果如下:

技术分享

 

    3,中文js更改

    上面我们把源js改好了,只不过界面显示的是英文,如果用了中文包的话,还需要更改easyui-lang-zh_CN.js

    在js文件中找到‘今天’ ‘关闭 ’事件定义的地方,并添加‘清空’

 技术分享

    代码:

 

[javascript] view plain copy
 
 print?技术分享技术分享
  1. $.fn.datebox.defaults.currentText = ‘今天‘;  
  2. $.fn.datebox.defaults.closeText = ‘关闭‘;  
  3. $.fn.datebox.defaults.cleanText = ‘清空‘;  

    

 

 

   修改事件:

             技术分享
    代码:

 

[javascript] view plain copy
 
 print?技术分享技术分享
    1. if ($.fn.datetimebox && $.fn.datebox){  
    2.     $.extend($.fn.datetimebox.defaults,{  
    3.         cleanText: $.fn.datebox.defaults.cleanText,  
    4.         currentText: $.fn.datebox.defaults.currentText,  
    5.         closeText: $.fn.datebox.defaults.closeText,  
    6.         okText: $.fn.datebox.defaults.okText,  
    7.         missingMessage: $.fn.datebox.defaults.missingMessage  
    8.     });  
    9. }  

easyui 日期控件清空值