layui动态数据表格单元格编辑及获取

淡淡的烟草味﹌ 2023-06-19 11:27 5阅读 0赞

var TB = '';
    layui.use('table', function() {
    	var table = layui.table;
    	var urls = '{:U("api/buyer/new_shopcar_goods")}';
    	//第一个实例
    	TB = table.render({
    		elem: '#demo',
    		height: '550px',
    		limits:[10,20,30],
    		limit:12,
    		toolbar:"true",//打开头部工具
    		defaultToolbar: ['filter', 'exports', 'print', { //自定义头部工具栏右侧图标。如无需自定义，去除该参数即可
    		  title: '提示'
    		  ,layEvent: 'LAYTABLE_TIPS'
    		  ,icon: 'layui-icon-tips'
    		}],
    		url: urls,
    		page: true,
    		cols: [[ //表头
    		{field: 'jfcode', title: '商品编码',  sort: true, fixed: 'left'}
    		,{field: 'name', title: '商品名称',  sort: true}
    	        ,{field: 'oe', title: 'OE码',  sort: true}
    		,{field: 'type_name', title: '一级分类',  sort: true}
    		,{field: 'two_type_name', title: '二级分类',  sort: true}
    		,{field: 'su_name', title: '单位',  sort: true}
    		,{field: 'ration', title: '标量',  sort: true}
    		,{field: 'sum', title: '数量',  sort: true,edit:true} //参数edit
    		,{field: 'z_price', title: '采购价',  sort: true}
    		,{field: '', title: '操作',toolbar: '#barDemo'}
    	]]
    	});
    
    });

layui.use('table', function(){
    	var table = layui.table;
    	//监听单元格编辑
    	table.on('edit(test)', function(obj){
    		var value = obj.value //得到修改后的值
    				,data = obj.data //得到所在行所有键值
    				,field = obj.field; //得到字段
                   var ration = data.ration;
    		var z = parseFloat(value) % parseInt(ration);
    		console.log(z)
    		if (z != 0){
    			layer.msg("请输入采购标量的倍数");
    			return false;
    		}
    		$.post('{:U("api/buyer/goto_new_car_update")}', {
    			'goods_id': data.id,
    			'id': data.szid,
    			'gsum': value
    		}, function(data) {
    			if(data.success) {
    				layer.msg(data.msg);
    			} else {
    				layer.msg(data.msg);
    			}
    		});
    		// layer.msg('[ID: '+ data.id +'] ' + field + ' 字段更改为：'+ value);
    	});
    });

发表评论取消回复

表情：

评论列表（有 0 条评论，5人围观）

还没有评论，来说两句吧...

相关阅读

相关 layui动态数据表格单元格编辑及获取

var TB = ''; layui.use('table', function() { var table = layui.table;

淡淡的烟草味﹌/ 2023年06月19日 11:27/ 0 赞/ 6 阅读

相关 layui数据表格点击编辑行数据事件

<table class="layui-hide" id="LAY_table_user" lay-filter="user"></table> 注意：单元格编辑事件

清疚/ 2023年06月06日 10:47/ 0 赞/ 75 阅读

相关 Markdown编辑表格实现合并单元格、单元格内容换行

Markdown虽然没有合并单元格的语法，但是Markdown是兼容HTML的，因此，我们可以通过HTML的方式实现单元格合并。跨行合并使用 rowspan 属性跨

冷不防/ 2023年01月22日 05:54/ 0 赞/ 104 阅读

相关 layui表格合并单元格多表_layui如何实现表格单元格合并

![Image 1][] 需求：下面用excel表格大概模拟下需求，左边是原来的，要改成右边这样的： ![Image 1][] 第一步：再生成表格后调用此方法，以合并

灰太狼/ 2022年11月19日 09:50/ 0 赞/ 388 阅读

相关 layui表格单元格中插入下拉框

这个实现采用了layui 社区一位大神的代码，在此感谢大神的分享，我自己做个记录，也给使用layui 的小伙伴们做一个分享。思路是这样的 > 可以使用自定义模板返回se

雨点打透心脏的1/2处/ 2022年10月27日 13:54/ 0 赞/ 769 阅读

相关 EasyUI DataGrid 编辑单元格

之前文章 [EasyUI DataGrid可编辑单元格 ][EasyUI DataGrid_]实现可编辑单元格，如果有多列都需要可编辑当点击一个单元格则此整行都会进行编辑

曾经终败给现在/ 2022年08月21日 02:12/ 0 赞/ 344 阅读

相关关于layui表格渲染templet解析单元格的问题

关于表格解析自定义单元格的解析参数请先详细查看官方文档：http://www.layui.com/doc/modules/table.html\templet 然后我简单说一

朱雀/ 2022年05月16日 05:07/ 0 赞/ 442 阅读

相关 Layui中操作数据表格，给指定单元格添加事件

最近入坑Layui这个为服务端程序员量身定做的前端框架。为什么不用vue结合各种流行前端框架Element、iView啊什么，后台大哥们不会啊！！！只好我来迁就他们

﹏ヽ暗。殇╰゛Y/ 2022年01月29日 14:47/ 0 赞/ 933 阅读

相关编辑layui表格

开发工具与关键技术：SQL Server 2014与jquery 作者：戴怡斌撰写时间：2019年7月26日在学习jquer

爱被打了一巴掌/ 2021年11月23日 23:26/ 0 赞/ 601 阅读

相关表格及合并单元格

01.表格主要有以下部分： <!DOCTYPE html> <html> <head> <title></title> </h...

朱雀/ 2021年03月29日 13:02/ 0 赞/ 836 阅读