为了加速表格互动编辑,我们往往希望通过选中行就触发了行编辑,完成行编辑后,再选中另一个行做编辑,同时上一个编辑行被自动保存,直至完成需要的编辑内容。

页面效果可能如下:


1)设置需要编辑的列 editable: true  参考如下:

 colModel: [
{ label: '字段编码', name: 'FieldCode', key: true, width: 180, editable: false },
{
label: '字段名称',
name: 'FieldName',
width: 150,
editable: true,
edittype: "text",
editrules: { required: true }
},
{
label: '字段类型',
name: 'DataType',
width: 10,
hidden: true,
editable: true,
},
{
label: '是否排序',
name: 'IsOrder',
width: 80,
editable: true,
edittype: "select",
editoptions: {
//value: "true:是;false:否"
value: "true:true;false:false"
}
},
{
label: '列宽',
name: 'Width',
width: 55,
editable: true,
editrules: { required: true, integer: true },
edittype: "text"
}]

2)使用 onSelectRow 选中行事件

    $("#fieldGrid").jqGrid({
...
onSelectRow: EditSelectRow,
pager: "#fieldGridPager",
...
});

3)编写行选中的自定义方法 EditSelectRow

//选中行启用行编辑
function EditSelectRow(id)
{
//原选中行ID
var oldSelectRowId = $("#selectRowId").val();
if (oldSelectRowId != null && oldSelectRowId != "" && oldSelectRowId.length > 0) {
$("#fieldGrid").jqGrid('saveRow', oldSelectRowId);//保存上一行
} //当前选中行
$("#selectRowId").val(id);//临时存储当前选中行
//$("#fieldGrid").jqGrid('editRow', id);
$("#fieldGrid").jqGrid('editRow', id, { keys: true, focusField: 1 });
}

需要特别注意:不能同时支持内置行编辑和行事件触发的行编辑。会产生行结束编辑的干扰项,比较坑,请绕开。若要使用行编辑请分别采用以下某一种方式

jqgrid 单击行启用行编辑,切换行保存原编辑行

jqgrid 使用自带的行编辑

jqgrid 选中行触发编辑,切换下一行时验证和异步保存上一行数据

jqgrid 单击行启用行编辑,切换行保存原编辑行的更多相关文章

  1. easyui datagrid动态设置行、列、单元格不允许编辑

    Easyui datagrid 行编辑.列编辑.单元格编辑设置 功能: 动态对datagrid 进行行.列.单元格编辑进行设置不允许编辑. 禁用行编辑: 在编辑方法调用前,对选择的行进行判断,如果不允 ...

  2. MFC六大核心机制之四:永久保存(串行化)

    永久保存(串行化)是MFC的重要内容,可以用一句简明直白的话来形容其重要性:弄懂它以后,你就越来越像个程序员了! 如果我们的程序不需要永久保存,那几乎可以肯定是一个小玩儿.那怕我们的记事本.画图等小程 ...

  3. uniq命令注意事项,检查重复行的时候,只会检查相邻的行。

    今天在使用uniq命令统计数量时,uniq -c总是得不到想要的效果,相同的行没有合并,例如 后来在http://ju.outofmemory.cn/entry/78365才看到,原来uniq检查重复 ...

  4. 模块——Getopt::Long接收客户命令行参数和Smart::Comments输出获得的命令行参数内容

     我们在linux常常用到一个程序需要加入参数,现在了解一下 perl 中的有关控制参数的模块 Getopt::Long ,比直接使用 @ARGV 的数组强大多了.我想大家知道在 Linux 中有的参 ...

  5. c编程:输入一个数字n,则n代表n行,每行输入2个数字a,b计算每行的a+b问题。

    输入 第一行输入要计算的数据组数 n 接下来的 n 行,每行包括两个数a和b 输出 每行输出一组数据中a+b的值 例子输入 2 1 2 4 0 例子输出 3 4 代码: #include<std ...

  6. 删除datatable的行后,出现“不能通过已删除的行访问该行的信息”的错误,即DeletedRowInaccessibleException

    删除datatable的行后,出现“不能通过已删除的行访问该行的信息”的错误 =========================================================== 采 ...

  7. #首行输入数n,接下来输入n行数,以空格隔开

    #首行输入数n,接下来输入n行数,以空格隔开 n = int(raw_input())# print nL = []for i in range(n): L.append([int(x) for x ...

  8. ASP.NET MVC 5 - 验证编辑方法(Edit method)和编辑视图(Edit view)

    在本节中,您将验证电影控制器生成的编辑方法(Edit action methods)和视图.但是首先将修改点代码,使得发布日期属性(ReleaseDate)看上去更好.打开Models \ Movie ...

  9. 验证编辑方法(Edit method)和编辑视图(Edit view)

    ASP.NET MVC 5 - 验证编辑方法(Edit method)和编辑视图(Edit view) 在本节中,您将验证电影控制器生成的编辑方法(Edit action methods)和视图.但是 ...

随机推荐

  1. Parcel + Vue 2.x 极速零配置打包体验

    继 Browserify.Webpack 之后,又一款打包工具 Parcel 横空出世 Parcel.js 的官网有这样的自我介绍 “极速零配置Web应用打包工具” 简单接触了一下,单从效率上来说,确 ...

  2. php获取本月、上月、上上月、今日、昨日、上周的起始时间

    // 本月起始时间: $begin_time = date ( "Y-m-d H:i:s", mktime ( 0, 0, 0, date ( "m" ), 1 ...

  3. tar.xz文件的解压

    xz是绝大数linux默认就带的一个压缩工具. 压缩包xz格式的居然比7z还要小. 不过xz也有一个坏处就是压缩时间比较长,比7z压缩时间还长一些.不过压缩是一次性的,所以可以忽略. xz压缩文件方法 ...

  4. react 传递非state给子元素的注意事项

    我们是使用react的时候,其实很多情况都不需要使用state去存储值,如果不涉及页面渲染的值,我们往往可以使用 this.xxx的方式:这样可以提高组件的性能,避免不必要的 re_render 带来 ...

  5. [基础知识]row类visible使用

    使用row的visibe属性,要反向遍历rowset,因为如果正向遍历,rowset是实时变化的,行号是错误的.正确代码如下: Local integer &k; For &k = & ...

  6. 学习笔记(3)——实验室集群WMS服务配置

    1.启动mgt结点的tomcat服务: [root@mgt zmq]# /home/geohpc/softwares/apache-tomcat-/bin/startup.sh 关闭为 [root@m ...

  7. 安卓基础之Activity的生命周期

    Activity的生命周期 onCreate 在Activity被创建时调用 onDesdroty 在Activity销毁时调用 onRestart 在Activity重新打开时调用 onStart ...

  8. 微信为啥不能直接下载.apk安装包

    今天遇到一个很蛋疼问题,我们的微信公众号上想放一个下载自己公司app的点击按钮,如果是苹果手机点击这个按钮就直接跳转到苹果的appstore,如果是android手机的话,就直接跳我们的服务器下载ap ...

  9. 基于MSMQ绑定的WCF服务实现总结

    一. 创建消息队列    1 1) 创建一个非事物性的私有队列    1 2)设置消息队列访问权限    2 二.创建WCF服务并绑定消息队列    4 1)创建HelloService服务    4 ...

  10. Prometheus Node_exporter 之 Network Netstat UDP

    Network Netstat UDP /proc/net/snmp 1. UDP In / Out type: GraphUnit: shortLabel: Datagrams out (-) / ...