前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >Layui表格单元个编辑事件

Layui表格单元个编辑事件

作者头像
PHY_68
发布2020-09-16 14:35:53
2K0
发布2020-09-16 14:35:53
举报
文章被收录于专栏:laopan技术分享laopan技术分享

Layui表格单元个编辑事件

开发工具与关键技术:MVC

作者:盘洪源

撰写时间:2019年6月26日星期三

在做到一个页面的时候我需要做到一个需求就是改变表格里面的字段为数量的单元格的数量然后后面的金额就会自动刷新。

我做的这个效果可能不是很好,就是因为这个我改变过后的数量一样要保存的这条数据上,数量也是一样,所以我这个效果就是改变数量后然后把数量传到后台再通过一个计算把金额计算出来再刷新表格,从而达到一个刷新金额的效果,就是这个效果可能会有点不怎么好看,就是刷新表格的时候会闪一下,这个效果有点不好。

首先就是要了解laui表格的单元格编辑事件

在这里插入图片描述
在这里插入图片描述

这是layui官网对单元格编辑的解说。

以下这个是我做的这个例子,就是通过获取到改变后单元格的值,然后通过post提交把数据传到后天,然后进行剩下的操作。

//主页面表表格单元格编辑改变事件

代码语言:javascript
复制
layuiTable.on('edit(Adjustment)', function (obj) {

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

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

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

                    var data = obj.data;

                    var CommodityDetailID =
data.CommodityDetailID;

                    var value = obj.value;

                   
$.post("/OtherAffiairs/Adjustment/Savesession", {
CommodityDetailID: CommodityDetailID, value: value }, function (msg) {

                        if (msg.State == true)
{

                            Adjustment =
layuiTable.reload("Adjustment", {

                                url:
"/OtherAffiairs/Adjustment/SessionShop"

                                

                            })

                        }

                    })

                })

把数量改变后的值传到后台,这就简单多了,然后就通过原价剩余数量就可以得到金额了,

代码语言:javascript
复制
item.TotalMoney
= values * item.DropPrice;

然后就是将你的这条数据的数量和金额都需要改变以下,然后再进行一个表格的刷新就行。

本文参与 腾讯云自媒体分享计划,分享自作者个人站点/博客。
原始发表:2019-06-27 ,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档