最近用了Easyui的日期控件datebox,項目中要將選中值清空,於是就研究了一下。
1,調用方法清空
- $('#yourId').combo('setText','');
2,更改js文件
從官網下載的源文件中,datebox控件界面只有‘Today’,‘Close’事件,我們可以把清空選項值的事件添加到js中去,這樣,只要引用了datebox這個控件,界面上就會有清空選項。具體修改步驟如下:
首先在官網上下載jquery.easyui.min.js文件。
在js文件中找到Today Close事件定義的地方,並添加Clean事件的定義。
源文件說明:
將源文件12733--12742行文件替換為:
代碼:
- }},currentText:"Today",cleanText:"Clean",closeText:"Close",okText:"Ok",buttons:[{text:function(_985){
- return $(_985).datebox("options").currentText;
- },handler:function(_986){
- $(_986).datebox("calendar").calendar({year:new Date().getFullYear(),month:new Date().getMonth()+1,current:new Date()});
- _975(_986);
- }},{text:function(_987){
- return $(_987).datebox("options").closeText;
- },handler:function(_988){
- $(this).closest("div.combo-panel").panel("close");
- }},{ text : function(_989) {
- return $(_989).datebox("options").cleanText;
- },handler : function(_990) {
- $(_990).combo('setValue', '').combo('setText', '');
- $(this).closest("div.combo-panel").panel("close");
- }}],formatter:function(date){
界面效果如下:
3,中文js更改
上面我們把源js改好了,只不過界面顯示的是英文,如果用了中文包的話,還需要更改easyui-lang-zh_CN.js
在js文件中找到‘今天’ ‘關閉 ’事件定義的地方,並添加‘清空’
代碼:
- $.fn.datebox.defaults.currentText = '今天';
- $.fn.datebox.defaults.closeText = '關閉';
- $.fn.datebox.defaults.cleanText = '清空';
修改事件:
代碼:
- if ($.fn.datetimebox && $.fn.datebox){
- $.extend($.fn.datetimebox.defaults,{
- cleanText: $.fn.datebox.defaults.cleanText,
- currentText: $.fn.datebox.defaults.currentText,
- closeText: $.fn.datebox.defaults.closeText,
- okText: $.fn.datebox.defaults.okText,
- missingMessage: $.fn.datebox.defaults.missingMessage
- });
- }