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

1,调用方法清空

  1. $('#yourId').combo('setText','');

2,更改js文件

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

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

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

源文件说明:

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

代码:

  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. return $(_989).datebox("options").cleanText;
  12. },handler : function(_990) {
  13. $(_990).combo('setValue', '').combo('setText', '');
  14. $(this).closest("div.combo-panel").panel("close");
  15. }}],formatter:function(date){

界面效果如下:

3,中文js更改

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

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

代码:

  1. $.fn.datebox.defaults.currentText = '今天';
  2. $.fn.datebox.defaults.closeText = '关闭';
  3. $.fn.datebox.defaults.cleanText = '清空';

修改事件:


    代码:

    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 日期控件清空值的更多相关文章

  1. 转 EasyUi日期控件datebox设置,只显示年月,也只能选择年月

    1.引入Jquery和easyui,注低版本的Jquery和easy不能使用,这里使用的Jquery是1.8.2easyui是1.6.1.1.easyui下载地址:http://www.jeasyui ...

  2. EasyUI 日期控件赋值

    $("#BillDateE").datebox("setValue", '2020/9/28'); $("#BillDateB").date ...

  3. JQuery EasyUI 日期控件 怎样做到只显示年月,而不显示日

    标题问题的答案在OSChina中 http://www.oschina.net/question/2282354_224401?fromerr=lHJTcN89 我还是把这个记录下来 ======== ...

  4. easyui 日期控件,选择日期小于等于当前日期,开始日期小于等于结束日期

    转载出处:http://blog.csdn.net/u013755149/article/details/76613028 $(function(){ $('#start_date').datebox ...

  5. easyui 日期控件限制起始相差30天

    $('#lendDateStart').datebox('calendar').calendar({ validator: function(date){ var endDateStr = $('#l ...

  6. EasyUI日期控件获值和赋值

    一,获值 1.$("#id").datebox('getValue') 2.$("input[name='mydate']").val() 参考:http:// ...

  7. Jquery获取EasyUI时间控件的值

    jquery easyui日期控件中,在页面里用JS拿到设置的日期值的方法 jquery easyui 日期框 有这样的一个日期文本框: <input type=" value=&qu ...

  8. C#日期控件datetimepicker保存空值方法

    方法一(推荐): 设置datetimepicker的属性ShowCheckBox为true 在窗口初始化时候,添加代码this.datetimepicker1.Checked = false; 保存日 ...

  9. easyui的日期控件

    1.日期控件只能点击控件进行选择, 不可手动编辑input框中的日期内容 editable="false" 2.日期控件既不可点击, 也不可手动编辑input框中的日期内容 dis ...

随机推荐

  1. jquery 追加元素的方法

    append() 方法在被选元素的结尾插入内容. 在里面 prepend() 方法在被选元素的开头插入内容. 在里面 after() 方法在被选元素之后插入内容. 在外面before() 方法在被选元 ...

  2. Python 2.7 - CentOS 7 - ImportError: No module named Tkinter

    It's simple. sudo yum -y install tkinter Just want to say, "I'm back".

  3. 关于问题ld:library not found for -lXXX的错误

    我猜想错误引起的原因可能是因为我复制target的时候原来的工程中的的link binary with libraries中原来的libpods-xxx.a没有删除.我将多余的libPods删除后解决 ...

  4. JMeter学习(三十四)测试报告优化

    如果按JMeter默认设置,生成报告如下: 从上图可以看出,结果信息比较简单,对于运行成功的case,还可以将就用着.但对于跑失败的case,就只有一行assert错误信息.(信息量太少了,比较难找到 ...

  5. javascript 逻辑操作符

    JS按位与(&) 0001 & 0011 --- 0001 只有两个数的值为1时,才返回1 JS按位异或  (^) 0101 (expression1)  1100 (expressi ...

  6. Java提高篇——理解String 及 String.intern() 在实际中的应用

    1. 首先String不属于8种基本数据类型,String是一个对象.   因为对象的默认值是null,所以String的默认值也是null:但它又是一种特殊的对象,有其它对象没有的一些特性. 2. ...

  7. html 以及JavaScript 转义

    1.之前遇到一个问题,在用js给某个控件赋值时如果含有单引号'或者双引号"有可能导致赋值不成功,如document.getElementById("txtTestBox1" ...

  8. (转载)solr时区问题解决方案

    solr默认的使用的是utc格林尼治时间,与我们的GMT+8相差8个小时,网上好多解决办法是在自己应用中的时间上加8个小时和减8个小时做变换:或者不用date类型,改为long. 个人感觉这两个办法都 ...

  9. (转)HTTP 长连接和短连接

    1. HTTP协议与TCP/IP协议的关系 HTTP的长连接和短连接本质上是TCP长连接和短连接.HTTP属于应用层协议,在传输层使用TCP协议,在网络层使用IP协议.IP协议主要解决网络路由和寻址问 ...

  10. ES5 Objece.creat实现继承

    Object.create() Object.create(proto [, propertiesObject ]) 是E5中提出的一种新的对象创建方式,第一个参数是要继承的原型,如果不是一个子函数, ...