layui单元格编辑监听

开发工具与关键技术：MVC

作者：Mr_恺

撰写时间：2019年7月26日

Layui数据表格有一个edit属性，只要我们在表格初始化把这个属性设置好了就能进行编辑了，修改数据

关键：edit: 'text' 把设置上

{ field: 'StockQuantity', title: '数量', align: 'center', edit: 'text', rowspan: 2, totalRow: true,},

就可以编辑啦

我们想改变了数量，成本合计也要跟着改变，这样子的话，我们就要视图获取它当前编辑的值去控制器进行操作，因为成本合计 = 进货价 * 数量

这样子的话我们就要用到单元格编辑监听事件：

视图获取当前编辑的值传到控制器：

//单元格被编辑，且值发生改变时触发

layuiTable.on('edit(tabPurchasingstock)', function (obj) { //注：edit是固定事件名，test是table原始容器的属性 lay-filter="对应的值"

//console.log(obj.value); //得到修改后的值

// console.log(obj.field); //当前编辑的字段名

console.log(obj.data); //所在行的所有相关数据

var field = obj.field;

if (field == 'StockQuantity') {

var Moditynymber = obj.data.Moditynymber;//商品编码

var StockQuantity = obj.value;//进货数量

}

//提交到控制器

$.post("/EverydayAffair/Purchasingstock/Updatecaigoushu", {

Moditynymber: Moditynymber,

StockQuantity: StockQuantity,

}, function (data) {

if (data != "") {

tabPurchasingstock = layuiTable.reload('tabPurchasingstock', {

url: "/EverydayAffair/Purchasingstock/SelectSession",

})

} else {

layer.alert(data.Text, { icon: 0, title: "三易通" });

}

})

在控制器这边：

只要我修改一下数量，它成本合计就跟着它改变：

layui单元格编辑监听相关推荐

Layui数据表格监听单元格编辑恢复原值
Layui数据表格监听单元格编辑,并获取原值 table.on('edit(test)', function(obj){ //注:edit是固定事件名,test是table原始容器的属性 lay-fi ...
ext js ajax表单校验,Extjs之grid单元格编辑校验(示例代码)
效果如图所示: 1. 添加CSS样式 .x-grid-cell-invalid .x-grid-cell-inner:before{content: "";position: ab ...
单元格编辑后级联汇总刷新
单元格编辑级联刷新 PDERPDB db = new PDERPDB(); int conid = 0; int pid = 0; string sql = ""; string ...
MFC List Control 控件添加单元格编辑，实现可编辑重写
在实现随机生成四则运算的个人项目中,目前已经完成基本功能,想要把程序变成一个Windows界面的程序.原本以为学习过MFC,应该很快就能完成.但是由于以前用的都是VC6.0,这次用了VS2010,稍微 ...
list Control实现单元格编辑与插入Combo Box
之前写过一篇(list Control实现单元格编辑)文章,那篇文章不是很完善执行的时候有时会出错,这篇文章经过完善后还加入了Combo Box功能! 这里我就只是晒一下我的代码; 头文件: [c-s ...
jqgrid编辑php,php – 实现jqgrid单元格编辑datepicker
我知道使用datepicker进行单元格编辑是可能的,因为引用了 here和 here.但是,当我单击单元格时,没有出现日期选择器.下面是相关列的colModel条目.我有datepicker UI可 ...
禁用行、列、单元格单元格编辑
禁用行编辑 var row = $("#dg").datagrid("getSelected"); //取选择的行 if(row) {if(row.produc ...
ag-grid 单元格编辑-下拉框
一.基本下拉框效果如下: 选中后的值直接就是界面显示的值(也是代码中定义的值).效果如下: 二.有id 的下拉框这个下拉框跟平常用的select 框类似,设置id和value,在界面选择的时候显示 ...
jqGrid使用总结：数据加载、单元格编辑、底部导航、汇总合计行等常用操作。
jqGrid是一个比较好的JavaScript开源表格组件,尤其它的编辑功能比较强大,另外其源码可读性非常好. 1.jqGrid资源 jqGrid资源相对来说比较少,国内倒是有很多所谓的jqGrid ...

layui单元格编辑监听

layui单元格编辑监听相关推荐

最新文章

热门文章