easyui datagrid的行编辑器editor 如何实现新增时可修改,编辑时,不可修改
项目出现一个需求,要求用户界面的用户名,新增时,可自由输入,编辑时,不可修改
html页面
<table id="gridlist" data-bind="datagrid:grid" >
<thead>
<tr>
<th field="ck" checkbox="true" readOnly:true ></th>
<th field="OptimisticLockField" hidden="true"></th>
<th field="UserCode" sortable="true" align="left" width="80" editor="{type:'validatebox',options:{required: true }}" >用户名 </th>
<th field="UserName" sortable="true" align="left" width="200" editor="{type:'validatebox',options:{required: true }}" >名称 </th>
<th field="OriginalPassword" sortable="true" align="left" width="200" >密码 </th>
<th field="Org" sortable="true" align="left" width="200" editor="{type:'lookup',options:{required:true,lookupType:'cloud.PcsOrg',window:{title:'所属机构'},queryParams:{State:9,Ou:false}}}" formatter="formatOrg" >所属机构 </th>
<th field="IsEnable" sortable="true" align="center" width="120" editor="{type:'checkbox',options:{on:1,off:0}}" formatter="com.formatCheckbox" >是否可用</th>
<th field="IsAdmin" align="center" width="120" editor="{type:'checkbox',options:{on:1,off:0}}" formatter="com.formatCheckbox">是否管理员</th>
<th field="LoginCount" sortable="true" align="right" width="120" >登录次数</th>
<th field="LastLoginDate" sortable="true" align="left" width="135" formatter="com.formatDate">最后登录日期</th>
<th field="LastLoginOU" align="left" width="170" hidden="true" >最后登录组织</th>
<th field="OrganizeNames" align="left" width="170">最后登录组织</th>
<th field="Permit" align="center" width="320" formatter="formatterButton"> 操作 </th>
<th field="Description" align="left" width="150" editor="text">描述</th> </tr>
</thead>
</table>
原先编辑方法
//原先编辑方法
this.editClick = function () {
if (self.RowsCount() > 1) return;
var row = self.grid.datagrid('getSelected');
if (row == null) {
com.message('error', "请选中需编辑的一行数据");
return;
}
var index = self.grid.datagrid('getRowIndex', row);
self.gridEdit.begin(index, row);
self.viewType = v_edit;
self.IsViewType(v_edit);
};
新的编辑方法
//新的编辑方法
this.editClick = function () {
if (self.RowsCount() > 1) return;
var row = self.grid.datagrid('getSelected');
if (row == null) {
com.message('error', "请选中需编辑的一行数据");
return;
}
//在编辑后把用户名改为查看状态
if (row._isnew == undefined) {
//编辑的时候把用户名改为查看状态
$('#gridlist').datagrid('removeEditor', 'UserCode');
}
var index = self.grid.datagrid('getRowIndex', row);
self.gridEdit.begin(index, row);
self.viewType = v_edit;
self.IsViewType(v_edit);
};
页面效果
1)新增时

2)编辑时

总结:使用 datagrid的removeEditor方法,指定对应列名,如语法: $('#gridlist').datagrid('removeEditor', 'UserCode');
easyui datagrid的行编辑器editor 如何实现新增时可修改,编辑时,不可修改的更多相关文章
- Easyui的datagrid的行编辑器Editor中添加事件(修改某个单元格带出其他单元格的值)
项目中有个datagrid需要编辑行时,用到Editor的属性,那么如何添加一个事件 问题:同一个编辑行中的某个单元格值改变时,修改其他单元格的值 页面用到的datagrid <table id ...
- Easyui Datagrid rownumbers行号四位、五位显示不完全的解决办法
Easyui Datagrid rownumbers行号四位.五位显示不完全的解决办法(引) 方法一: 相信很多人在使用easyui的时候都遇到过这个问题,当我们设置成显示Rownumber的时候,你 ...
- 扩充 jQuery EasyUI Datagrid 数据行鼠标悬停/离开事件(onMouseOver/onMouseOut)
客户需求: jQuery EasyUI Datagrid 用户列表鼠标悬停/离开数据行时显示人员头像(onMouseOver/onMouseOut) 如图所示,Datagrid 鼠标悬停/离开数据行时 ...
- 扩展 jQuery EasyUI Datagrid 数据行鼠标悬停/离开事件(onMouseOver/onMouseOut)
客户需求: jQuery EasyUI Datagrid 用户列表鼠标悬停/离开数据行时显示人员头像(onMouseOver/onMouseOut) 如图所示,Datagrid 鼠标悬停/离开数据行时 ...
- EASYUI DATAGRID 改变行值
在easyui datagrid 中如果要 改变当前选中行的值又不想用编辑状态,或者想从外部改变某一行的值,下面的方法可以做到 function test() { var ro ...
- jQuery easyuI datagrid 多行编辑
在easyUI 动态绑定部分数据后,需要有部分列可以修改,研究了一天终于搞定.这是小弟的做法,望各位有好招的大侠指点. 1.添加jQuery 和jQuery easyuI的引用. 2.添加id为tt的 ...
- EasyUI datagrid : 启用行号、固定列及多级表头后,头部行号位置单元格错位的问题
症状如图: 上图中,行号列与checkbox 列融合了.解决方法是在datagrid 的 onLoadSuccess 事件中加入如下代码: var opts = $(this).datagrid('o ...
- easyUI datagrid 多行多列数据渲染异常缓慢原因以及解决方法
原因 最近,在优化之前公司帮联想(外包)做的一个老的后台管理系统,由于项目是基于easy UI框架,页面是后台用jsp实现的,再加上在公司推行前后端分离的实践,大部分项目都基于vue采用前后端分离去实 ...
- EasyUI datagrid 双击行事件
1.EasyUI 实现点击行的任何位置,触发事件 onLoadSuccess:function(data){ } , pagination : false, //双击事件 onDblClickRow: ...
随机推荐
- java学习(2):类和对象
一.类 类可以看成是创建对象的模板,它描述一类对象的行为和状态.创建对象也叫类的实例化.类必须先定义才能使用. 通过下面一个简单的类来理解下Java中类的定义: public class Dog { ...
- centos7修改网卡命名规则
实验目的: 修改默认的网卡命名规则,习惯于ethx的形式 实验环境: centos7 熟悉控制网卡名字的规则生产的参数biosdevname/net.ifnames /etc/default/gr ...
- ELK快速入门(三)logstash收集日志写入redis
ELK快速入门三-logstash收集日志写入redis 用一台服务器部署redis服务,专门用于日志缓存使用,一般用于web服务器产生大量日志的场景. 这里是使用一台专门用于部署redis ,一台专 ...
- python的包管理软件Conda的用法
创建自己的虚拟环境 conda create -n learn python= 切换环境: activate learn 查看所有环境: conda env list 安装第三方包: conda in ...
- Redis持久化 - RDB和AOF
原文:https://segmentfault.com/a/1190000016021217 一.持久化的作用 1. 什么是持久化 持久化(Persistence),即把数据(如内存中的对象)保存到可 ...
- Tensorcore使用方法
用于深度学习的自动混合精度 深度神经网络训练传统上依赖IEEE单精度格式,但在混合精度的情况下,可以训练半精度,同时保持单精度网络的精度.这种同时使用单精度和半精度表示的技术称为混合精度技术. 混合 ...
- GitHub小知识与教程
如果你是一枚Coder,但是你不知道Github,那么我觉的你就不是一个菜鸟级别的Coder,因为你压根不是真正Coder,你只是一个Code搬运工. 但是你如果已经在读这篇文章了,我觉的你已经知道G ...
- Java并发(八)计算线程池最佳线程数
目录 一.理论分析 二.实际应用 为了加快程序处理速度,我们会将问题分解成若干个并发执行的任务.并且创建线程池,将任务委派给线程池中的线程,以便使它们可以并发地执行.在高并发的情况下采用线程池,可以有 ...
- Gym - 100962F: Frank Sinatra (树上莫队+bitset)
题意:给定一棵树,带边权.然后Q次询问,每次给出(u,v),求这个路径上最小的未出现的边权. 思路:树上莫队,求mex可以用分块或者bitset,前者可能会快一点. 莫队过程:求出欧拉序,即记录d ...
- Pycharm激活方法使用的是(license server)
pycharm所有版本 http://www.jetbrains.com/pycharm/download/previous.html打开激活窗口 选择 Activate new license wi ...