easyui datagrid 行编辑和提交方,废话就不多说了,直接上代码

 <div style="margin: 5px;">
<table id="dg" class="easyui-datagrid" title="确认单据" style="width: 100%; height: 540px; margin: 20px;"
data-options="loadMsg: '正在加载,请稍候...',
nowrap: false,
border: true,
methord: 'post',
collapsible: false,
fit: false,
fitColumns: false,
remoteSort: true,
rownumbers: true,
pagination: true,
pageSize: 20,
pageList: [20, 30, 40, 50, 100],
striped: true,
toolbar: '#tb',
onClickRow: onClickRow,
singleSelect:false">
<thead>
<tr> <th data-options="field:'obj2',width:140,align:'center',checkbox:true">物料代码</th>
<th data-options="field:'obj1',width:75,display:'none',align:'center'">主键ID</th>
<th data-options="field:'DJID',width:70,align:'center'">单据ID</th>
<th data-options="field:'obj3',width:240,align:'center'">物料描述</th>
<th data-options="field:'obj4',width:75,align:'center'">计划数量</th>
<th data-options="field:'obj5',width:75,align:'center'">计划重量</th>
<th data-options="field:'obj6',width:80,align:'center'">实际入库数量</th>
<th data-options="field:'obj7',width:80,align:'center'">实际入库重量</th>
<th data-options="field:'obj8',width:80,align:'center',editor:'text'">入高架库数量</th>
<th data-options="field:'obj9',width:80,align:'center',editor:{type:'text'}">入高架库重量</th>
<th data-options="field:'obj10',width:80,align:'center',editor:{type:'text'}">入线边库数量</th>
<th data-options="field:'WorkName',width:80,align:'center',editor:{type:'text'}">入线边库重量</th>
</tr>
</thead>
</table>
<div id="tb" style="height: auto">
<a href="javascript:void(0)" class="easyui-linkbutton" data-options="iconCls:'icon-save',plain:true" onclick="accept()">保存</a>
</div> </div>
界面:
注意:
Table的 data-options 属性 onClickRow: onClickRow 属性双击行改变行状态,用于编辑数据
 
<th data-options="field:'WorkName',width:80,align:'center',editor:{type:'text'}">入线边库重量</th>
其中的
editor:{type:'text'} 属性可以在双击后启用单元格的状态
  var editIndex = undefined;
function endEditing(){
if (editIndex == undefined){return true}
if ($('#dg').datagrid('validateRow', editIndex)){
$('#dg').datagrid('endEdit', editIndex);
editIndex = undefined;
return true;
} else {
return false;
}
}
function onClickRow(index){
if (editIndex != index){
if (endEditing()){
$('#dg').datagrid('selectRow', index)
.datagrid('beginEdit', index);
editIndex = index;
} else {
$('#dg').datagrid('selectRow', editIndex);
}
}
} function accept(){
if (endEditing()){
var rows = $('#dg').datagrid('getChanges');
var $dg=$('#dg');
if ($dg.datagrid('getChanges').length) {
// var inserted = $dg.datagrid('getChanges', "inserted"); //获取添加状态的行
// var deleted = $dg.datagrid('getChanges', "deleted");//获取删除状态的行
var updated = $dg.datagrid('getChanges', "updated");//获取修改状态的行
var effectRow = new Object();
if (updated.length) {
effectRow["updated"] = JSON.stringify(updated);
}
$.post("/PFK/ashx/UpdateManger.ashx",effectRow, function(rsp) {
debugger;
if(rsp.status){
$.messager.alert("提示", "提交成功!");
$dg.datagrid('acceptChanges');
}
}, "JSON").error(function() {
// $.messager.alert("提示", "提交错误了!");
});
}
}
}
 string updated = context.Request["updated"];
List<ShowCCK_DHModle> modelList = null;
if (updated != "")
{
modelList = RFIDScan.CommFunction.JsonDeserialize<List<ShowCCK_DHModle>>(updated);
}
//获取数据后的其他操作

easyui datagrid 批量编辑和提交数据的更多相关文章

  1. [转]easyui datagrid 批量编辑和提交

    web前台主要代码: <script type="text/javascript"> $(function() { var $dg = $("#dg" ...

  2. Easyui datagrid 批量编辑和提交

    <script type="text/javascript"> $(function() { var $dg = $("#dg"); $dg.dat ...

  3. EASYUI datagrid批量修改与提交

    http://www.cnblogs.com/szytwo/archive/2012/08/29/2662169.html 前台主要代码: <script type="text/jav ...

  4. easyui datagrid可编辑表格使用经验分享

    文章目录 1相关接口方法 2列属性formatter 3编辑器类型 3.1基于my97的编辑器 3.2简单的密码编辑器 3.3动态增加/删除编辑器 4字段的级联操作 4.1combobox的级联操作 ...

  5. 关于EasyUI DataGrid行编辑时嵌入时间控件

    本人做一个名为“安徽中控”项目时,为快速开发基础数据增删改模块,遂采用EasyUIDatagrid将所有增删改查的操作都集中于表格中,并且所有增删改查操作都集中于泛型对象,从而不必为每个表写具体的增删 ...

  6. (转)扩展jquery easyui datagrid 之动态绑定列和数据

    本文转载自:http://blog.csdn.net/littlewolf766/article/details/7336550 easyui datagrid 不支持动态加载列,上次使用的方法是自己 ...

  7. EasyUI DataGrid能编辑

    创建DataGrid <table id="tt"></table> $('#tt').datagrid({     title:'Editable Dat ...

  8. easyui datagrid行编辑中数据联动

    easyui的datagrid中行内编辑使用数据联动.即:当编辑产品编号时,该行的产品名称自动根据产品编号显示出来. 在编辑中获取当前行的索引 function getRowIndex(target) ...

  9. EasyUI datagrid 行编辑

    一.HTML: <div class="info"> <div class="info_tt"> <span class=&quo ...

随机推荐

  1. DLP与上网行为管理的差别总结

    参考网康和深信服的上网行为管理手册,总结了一下DLP与上网行为管理的差别: DLP与上网行为管理在功能和使用目的上有很大不同.主要体现在: 上网行为管理主要是对用户访问目标URL过滤,应用端口限制,上 ...

  2. stringutil的方法

    StringUtils 源码,使用的是commons-lang3-3.1包. 下载地址 http://commons.apache.org/lang/download_lang.cgi 以下是Stri ...

  3. Java并发编程--AQS

    概述 抽象队列同步器(AbstractQueuedSynchronizer,简称AQS)是用来构建锁或者其他同步组件的基础框架,它使用一个整型的volatile变量(命名为state)来维护同步状态, ...

  4. css样式小框架

    1.如div{...}会给所有的<div></div>增加样式. 2.名前井号“#”:对应html中的标签的id属性,写法为#name.如#p1{...}会给<p id= ...

  5. error LNK2026: 模块对于 SAFESEH 映像是不安全的(转)

    原文转自 http://www.cnblogs.com/hanxi/archive/2012/06/10/2544230.html 今天使用VS2012遇到一个问题:"链接器工具错误 LNK ...

  6. 兼容ie7到ie11,edge,chrome,firefox的ajax发送接收post数据代码

    /* * 生成XMLHttpRequest */ function getxhr() { //获取ajax对象 var xhr = null; try { xhr = new XDomainReque ...

  7. 【linux高级程序设计】(第十四章)TCP高级应用

    文件I/O方式比较 1.阻塞式文件I/O 进程从调用函数开始,直到返回这段时间都处于阻塞状态. 2.非阻塞式文件I/O 如果当前没有数据可操作,将不阻塞当前进程,而是立即返回一个错误信息.需要反复尝试 ...

  8. [BZOJ1191][HNOI2006]超级英雄Hero 类似二分图的最大匹配

    1191: [HNOI2006]超级英雄Hero Time Limit: 10 Sec  Memory Limit: 162 MBSubmit: 4740  Solved: 2162[Submit][ ...

  9. EntityFramework之一对多关系(三)

    上篇介绍了一对一关系,下面介绍下一对多关系代码编写. 1.新建model实体,Product是产品类,Order是订单,一个产品对应多个订单 public class Product { public ...

  10. Dfs+Spfa【p1606】[USACO07FEB]荷叶塘Lilypad Pond

    Description 为了让奶牛们娱乐和锻炼,农夫约翰建造了一个美丽的池塘.这个长方形的池子被分成了M行N列个方格(1≤M,N≤30).一些格子是坚固得令人惊讶的莲花,还有一些格子是岩石,其余的只是 ...