Easyui 行编辑
之前没用过,突然用了的时候手忙脚乱的感觉 找了官方文档也好 百度了一大堆东西 表示个人脑袋跟不上思路
直接铺上简化的 以后自己 找起来也方便 以下代码已经执行 应该不会再错了
<table id="dataPackageMenuList" title="套餐菜品列表" class="easyui-datagrid" style="width:100%;height:100%"
toolbar="#toolbar1" pagination="true"
rownumbers="true" fitColumns="true" singleSelect="true">
<thead>
<tr>
<th data-options="field:'id',hidden:true">ID</th>
<ks:listTag table="T_CATER_PACKAGEMENU" column="REMARKS"/>
<ks:listTag table="T_CATER_PACKAGEMENU" column="PACKAGEID"/>
<ks:listTag table="T_CATER_PACKAGEMENU" column="MENUID"/>
<th field="menuName" width="100px">菜品名</th>
<th field="menuPrice" width="100px">菜品价格</th>
<th field="menuNum" width="100px" data-options="editor:{type:'numberbox',options:{required:true}}">菜品数量</th> <!--需要编辑的行 --> </tr>
</thead>
</table>
JS部分
$("#dataPackageMenuList").datagrid({
onAfterEdit:function(rowIndex,rowData){
//TODO 结束行编辑
editRow = undefined;
if(rowData.menuNum != packageMenuNum){ //这个if选择性无视 业务逻辑
editPackageMenuNum.push({"id":rowData.id,"menuMum":rowData.menuNum});
}
},
onClickRow:function(rowIndex,rowData){
//TODO 触发行编辑方法
packageMenuNum = rowData.menuNum; //这个赋值也是业务逻辑 选择性无视
bookDataListRow(rowIndex);
}
});
});
//行编辑
var editRow = undefined;
function bookDataListRow(index){
if(editRow!=undefined){ //判断编辑器是否处于打开状态
var editors = $('#dataPackageMenuList').datagrid('getEditors', editRow);
$('#dataPackageMenuList').datagrid('endEdit',editRow);
}
if(editRow==undefined){
$('#dataPackageMenuList').datagrid('beginEdit',index);
editRow=index;
}
}
效果图如下
Easyui 行编辑的更多相关文章
- Jquery easyui开启行编辑模式增删改操作
Jquery easyui开启行编辑模式增删改操作 Jquery easyui开启行编辑模式增删改操作先上图 Html代码: <table id="dd"> </ ...
- [转]Jquery easyui开启行编辑模式增删改操作
本文转自:http://www.cnblogs.com/nyzhai/archive/2013/05/14/3077152.html Jquery easyui开启行编辑模式增删改操作先上图 Html ...
- EasyUI DataGrid 实现单行/多行编辑功能
要实现 EasyUI DataGrid 的可编辑很简单,在需要编辑的列添加 editor [编辑器]就可以了. 单行编辑 // 初始化数据列表 function initDatagrid() { $( ...
- 关于EasyUI DataGrid行编辑时嵌入时间控件
本人做一个名为“安徽中控”项目时,为快速开发基础数据增删改模块,遂采用EasyUIDatagrid将所有增删改查的操作都集中于表格中,并且所有增删改查操作都集中于泛型对象,从而不必为每个表写具体的增删 ...
- easyui datagrid 行编辑功能
datagrid现在具有行编辑能力了,使用时只须在columns中为需要编辑的列添加一个editor属性,编辑保存时同时具有数据校验能力. 看一个例子效果图: 代码如下: $('#tt').datag ...
- JS框架avalon简单例子 行编辑 添加 修改 删除 验证
为什么要写这个例子:做表单的时候,表单包含主子表,对于子表的编辑,使用的是easyui datagrid的行编辑功能,由于业务比较复杂,实现起来比较麻烦,代码写的也很多,因为插件的封装,无法操作原始的 ...
- 扩展jquery easyui datagrid编辑单元格
扩展jquery easyui datagrid编辑单元格 1.随便聊聊 这段时间由于工作上的业务需求,对jquery easyui比较感兴趣,根据比较浅薄的js知识,对jquery easyui中的 ...
- 数据表格 - DataGrid - 行编辑
行编辑一般用于单行数据的增删改,如果不用行编辑实现的话,对于表单数据量不大的情况,可以使用弹窗(Dialog),如果数据量比较大,也就是需要操作的数据比较多的时候,可以新开一个tab页. 新增/编辑 ...
- CRM行编辑控件
原创,转载请说明出处 王红福 http://www.cnblogs.com/hellohongfu/p/4792452.html CRM 本身的表格可以根据定义显示列信息,但是出于性能考虑不能详细的展 ...
随机推荐
- 汇编学习笔记(AT&T语法)
一个最基本的汇编程序如下所示: .section .data .section .text .globl _start _start: movl $, %eax # the number 1 is t ...
- threading模块、ThreadLocal
一.threading模块 1.线程对象的创建 1.1 Thread类直接创建 import threading import time def countNum(n): # 定义某个线程要运行的函数 ...
- 六顶思维帽的思考,敏捷开发?——By Me
人类的思维可以分为很多种,其中按照思维的深度和广度的侧重,可以分为纵向思维和横向思维两种: 简单的来说,“六顶思维帽”可以简单的理解为下图所示: 如何使用这种思维方式呢?举个例子:先输入一个待讨论的事 ...
- Open Source VOIP applications, both clients and servers (开源sip server & sip client 和开发库)
SIP Proxies SBO SIP Proxy Bypass All types of Internet Firewall JAIN-SIP Proxy Mini-SIP-Proxy A very ...
- github-----文件项目的推拉二式
将本地项目文件推送上线: $ git init $ git add . $ git commit -m "第一次修改" $ git log $ git remote add ori ...
- java项目地址和服务器地址区分
项目地址String filePath = request.getSession().getServletContext().getRealPath("/") + "up ...
- OPNET 安装运行问题总结
OPNET作为专业级网络仿真软件,其强大的功能使其在多个领域有广泛的应用.“越强大的软件,安装越闹心”,OPNET就是这样一款安装和运行的都很闹心的软件,这里简单转载和记录我安装OPNET和使用中的问 ...
- Visual Studio各版本区别
Visual Studio 是微软公司推出的开发环境,Visual Studio 可以用来创建 Windows 平台下的 Windows 应用程序和网络应用程序,也可以用来创建网络服务.智能设备应用程 ...
- python中命令行参数
python中的命令行参数 python中有一个模块sys,sys.argv这个属性提供了对命令行参数的访问.命令行参数是调用某个程序时除程序名外的其他参数. sys.argv是命令行参数的列表 le ...
- java调用操作系统命令
java的Runtime.getRuntime().exec(commandStr)可以调用执行cmd指令. cmd /c dir 是执行完dir命令后关闭命令窗口. cmd /k dir 是执行完d ...