EasyUI datebox 设置不可编辑后再次修改为可编辑失效的解决
工作中遇到的问题,折腾了好久:
如下图:

需求:当状态发生改变后,如果状态是未核实 , 核实人 核实时间 核实结果 核实说明 均为不可编辑状态
具体js代码如下:
//状态改变
$('#jsStatus').combobox({
onSelect: function(r){
if("dhs"==r.value){
$('#jsPersonNo').val("");
$('#jsPersonNo').attr("disabled",true);
$('#jsVerifyDate').datebox("setValue","");
$('#jsVerifyDate').datebox({disabled:true});
$('#jsResult').combobox("setValue","");
$('#jsResult').combobox({disabled:true});
$('#jsVerifyRemark').val("");
$('#jsVerifyRemark').prop('readonly',true);
}
if("yhs"==r.value){
$('#jsPersonNo').attr("disabled",false);
$("#jsVerifyDate").datebox({disabled:false});
$('#jsResult').combobox({disabled:false});
$('#jsVerifyRemark').prop('readonly',false);
}
}
});
但是发现出现了如下问题: 当状态改变为 已审核(yhs) 时, databox 日期的 disabled 属性修改为false,可编辑失效(具体原因尚不明确),代码为上面红色部分 页面效果如下图:

发现核实时间依然为不可编辑......
经过尝试,发现移除disabled属性可以解决问题,于是将JS中红色部分代码修改如下:
$('#jsVerifyDate').removeAttr("disabled");
修改之后功能问题是解决了,但是外观问题又来了,看下图:

日期控件是出来了,也可编辑,但是文本框还是灰色,而且日期控件的图标也没了,没办法,只有想办法继续改.........
百度了很多资料,没有找到相关的解决方案........,最后只有自己试了
分析页面发现,在修改为不可编辑状态时,EasyUI给改元素增加了一些属性,如下图(红色框框住的部分为easyUI添加的 class):

对EasyUI 添加的class进行一下说明:
Wdate: 用于控制显示日期图标的样式 class
disabled: 控制文本框为不可编辑时的样式class ,如果为不可编辑,easyUI会添加此样式将文本框会变为灰色
现在,我只要将控制文本框为灰色的这个样式移除就好了:
在JS里添加如下代码:
$('#jsVerifyDate').removeClass("disabled"); //移除disabled的样式
最后完整的JS代码如下(红色是与以前代码不同的部分):
//状态改变
$('#jsStatus').combobox({
onSelect : function(r){
if("dhs"==r.value){
$('#jsPersonNo').val("");
$('#jsPersonNo').attr("disabled",true);
$('#jsVerifyDate').datebox("setValue","");
$('#jsVerifyDate').datebox({disabled:true});
$('#jsResult').combobox("setValue","");
$('#jsResult').combobox({disabled:true});
$('#jsVerifyRemark').val("");
$('#jsVerifyRemark').prop('readonly',true);
}
if("yhs"==r.value){
$('#jsPersonNo').attr("disabled",false);
$('#jsVerifyDate').removeAttr("disabled");
$('#jsVerifyDate').removeClass("disabled");
$('#jsResult').combobox({disabled:false});
$('#jsVerifyRemark').prop('readonly',false);
}
}
});
至于 $("#jsVerifyDate").datebox({disabled:false}); 失效,个人认为是因为easyUI 设置 datebox disabled:true 属性的时候添加了部分样式,但是取消 disabled的时候这些样式又没有被删除,所以出现这样的状况
另外这里推荐使用 onSelect 事件,之前使用onChange事件出现了问题,页面加载初始值无法显示,改成onSelect就好了.
EasyUI datebox 设置不可编辑后再次修改为可编辑失效的解决的更多相关文章
- ComboBox控件“设置 DataSource 属性后无法修改项集合”的解决【转】
编写Winform程序,遇到comboBox的绑定事件和索引项变更事件的冲突问题,就是“设置 DataSource 属性后无法修改项集合”的错误问题,网上查了很多,大多说在索引项变更是进行非空判断,还 ...
- C# LIstbox 解决WinForm下ListBox控件“设置DataSource属性后无法修改项集合”的问题
解决WinForm下ListBox控件“设置DataSource属性后无法修改项集合”的问题 分类: winform2008-05-24 02:33 2592人阅读 评论(11) 收藏 举报 winf ...
- 解决WinForm下ListBox控件“设置DataSource属性后无法修改项集合”
解决WinForm下ListBox控件“设置DataSource属性后无法修改项集合” 最近更新: 2013-2-15 587 很少写WinForm程序第一次使用ListBox控件就遇到了比 ...
- easyui datebox 设置不可编辑
easyui datebox不允许编辑可以输入 editable="false"<input class="easyui-datebox" editabl ...
- easyui datagrid设置fit: true后,页面显示不全的情况
跟工具栏有关 <div id="tb"> <div style="float:left;"> <a href="#&qu ...
- C#ComboBox控件“设置 DataSource 属性后无法修改项集合”的解决方法
在使用ComboBox控件时,遇到了重新绑定赋值出问题的情况.正常情况下,对于数据重新赋值的或者绑定数据源的时候,为了防止数据出现问题,都会先清空原来数据,所以就这样写了,但是没有相当恰恰这样写就出现 ...
- 黄聪:jquery mobile通过a标签页面跳转后,样式丢失、js失效的解决方法
问题描述: 用ajax跳转的时候,从a.html跳转到b.html后,b.html的css以及js都失效了. 解决办法1: 将所有的css以及js全部放在div内. 原理: 由于jqm的ajax跳转的 ...
- hightcharts在移动端运用 FastClick后苹果上legend点击失效的解决办法
问题:在移动端做图表运用了hightcharts,引用了fastclick来消除300ms的延迟,但是发现苹果(安卓正常)上hightcharts的legend点击不起作用了,必须长按才行. 使用fa ...
- 2python脚本在window编辑后linux不能执行的问题
参考简书博主天道酬勤abcd python脚本在windows编辑后,在linux下执行提示 /usr/bin/python^M: bad interpreter: No such file or d ...
随机推荐
- Prometheus监控学习笔记之教程推荐
最近学习K8S和基于容器的监控,发现了如下的教程质量不错,记录下来以备参考 1. K8S最佳实战(包括了K8S的Prometheus监控和EFK日志搜集) https://jimmysong.io/k ...
- python类的__slots__属性、__del__属性、上下文(__enter__和__exit__)、
常规情况下,类的属性字典是共享的,而实例的字典是独立的.如果一个类的属性较少,但是拥有很多的实例,这些实例的属性字典会占用较多的内存空间.对这样的类来说,为了节省内存空间,可以使用__slots__类 ...
- RGB颜色对照表
RGB颜色对照表 https://www.cnblogs.com/android100/p/android-rgb-list.html #FFFFFF #FFFFF0 #FFFFE0 ...
- Linux - TCP编程相关配置1
100万并发连接服务器笔记之1M并发连接目标达成 第四个遇到的问题:tcp_mem 在服务端,连接达到一定数量,诸如50W时,有些隐藏很深的问题,就不断的抛出来. 通过查看dmesg命令查看,发现大量 ...
- java定时任务调度工具
一.什么是定时任务调度 基于给定的时间点,给定的时间间隔或者给定的时间执行次数自动执行的任务. 二.java中常用的定时任务调度工具: Timer Quartz 2.1两者区别: Timer源自jdk ...
- Flash Memory 简介【转】
本文转载自:https://linux.codingbelief.com/zh/storage/emmc/ Flash Memory 是一种非易失性的存储器.在嵌入式系统中通常用于存放系统.应用和数据 ...
- CF1131D tarjan,拓扑
题目链接 541div2 http://codeforces.com/contest/1131/problem/D 思路 给出n序列和m序列的相对大小关系 构造出最大值最小的序列 缩点+拓扑 小的向大 ...
- SP10707 COT2 - Count on a tree II 莫队
链接 https://vjudge.net/problem/SPOJ-COT2 https://www.luogu.org/problemnew/show/SP10707 思路 dfs欧拉序转化为普通 ...
- SCU 4445 Right turn(dfs)题解
思路:离散化之后,直接模拟就行,标记vis开三维 代码: #include<iostream> #include<algorithm> #include<cstdio&g ...
- 【Spring Security】三、自定义数据库实现对用户信息和权限信息的管理
一 自定义表结构 这里还是用的mysql数据库,所以pom.xml文件都不用修改.这里只要新建三张表即可,user表.role表.user_role表.其中user用户表,role角色表为保存用户权限 ...