Layui表格的修改

- 日理万妓 2021-11-23 10:32 963阅读 0赞

Layui表格的修改

开发工具与关键技术： Visual Studio 2015 – jQuery  
作者：廖亚星  
撰写时间：2019年 7 月 20日  
当数据在Layui在表格上显示的时候，我们可以对表格中的数据进行修改，只需要在cols中设置  
edit: true就可以修改了，默认选择商品的数量为1，现在我将其中一条数据的数量修改为10，可以发现，虽然表格中的数据修改了，但是下面的合计并没有进行修改，那是因为页面上选择的数据只是一个session，我们还要写修改的方法  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDU0MDY4MQ_size_16_color_FFFFFF_t_70]  
现在我们来定义修改数据的方法，首先定义需要修改的参数，然后获取session，最后通过foreach遍历循环修改值  
public ActionResult UpdateShuangliang(int CommodityManagementID, decimal SalesDiscount, string SalesRemarks,decimal SellingPrices,decimal SellQuantity,decimal TotalAmount)  
\{  
List listMingxi = new List();  
if (Session\[“IsOptions”\] != null)  
\{  
listMingxi = Session\[“IsOptions”\] as List;  
\}  
foreach (var item in listMingxi)  
\{  
if (item.CommodityManagementID == CommodityManagementID)  
\{  
item.SalesDiscount = SalesDiscount;  
item.SalesRemarks = SalesRemarks;  
item.SellQuantity = SellQuantity;  
item.SellingPrices = SalesDiscount \* item.TagPrice;  
item.TotalAmount = SalesDiscount \* SellQuantity \* item.TagPrice;

}
            }
            return Json(listMingxi, JsonRequestBehavior.AllowGet);
        }

然后在Layui页面中引用方法  
layuiTable.on(‘edit(employee)’, function (obj) \{  
//注：edit是固定事件名，test是table原始容器的属性 lay-filter=“对应的值”  
var CommodityManagementID = obj.data.CommodityManagementID;  
var SalesDiscount = obj.data.SalesDiscount;  
var SellQuantity = obj.data.SellQuantity;  
var SellingPrices = obj.data.SellingPrices;  
var SalesRemarks = obj.data.SalesRemarks;  
var TotalAmount = obj.data.TotalAmount;  
$.post(“UpdateShuangliang”, \{TotalAmount:TotalAmount, CommodityManagementID: CommodityManagementID, SalesDiscount: SalesDiscount, SellQuantity: SellQuantity, SellingPrices: SellingPrices, SalesRemarks: SalesRemarks \}, function (data) \{  
if (data != “”) \{  
TabTitles = layuiTable.reload(‘employee’, \{  
url: “commoditylistselect”,  
\})  
\} else \{  
layer.alert(data.Text, \{ icon: 0, title: “三易通” \});  
\}  
\})  
\});  
这样当我修改表格中的值，合计区域也会对应的进行更改

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDU0MDY4MQ_size_16_color_FFFFFF_t_70 1]

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDU0MDY4MQ_size_16_color_FFFFFF_t_70]: /images/20211122/f4cb9eeddddb43be9e0775f7ef58784d.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDU0MDY4MQ_size_16_color_FFFFFF_t_70 1]: /images/20211122/3866a5b135614dbf84dad00840ee2683.png