直接在表格里修改数据

 

1. 修改数据，身为初学者的我，学得多的就是弹出模态框的修改数据，可现在，我接触到了一个新的修改数据的方法，那就是在渲染表格出来的时候，直接在表格里面把数据修改出来，这让我苦恼了好几天，终于在Layui里面发现了一个非常简单的方法，就一个参数的使用。Edit,它是一个String类型，它在单元格编辑类型（默认不开启）目前只支持：text（输入框）。Edit的使用只需要在就后面加它的属性就好了。

 

var tabResComeMes;

        var layerIndex = 0; //加载层

        var layer, layuiTable; //保存layui模块以便全局使用

        var rowdata;

        var editvalue = false;

 

$(function () {

            layui.use(['layer', 'table'], function () {

                layuiTable = layui.table;

                layer = layui.layer,

                tabResComeMes = layuiTable.render({

                elem: '#tabResComeMes',

                url: '/PurManger/ResCome/SelectSessImportStudent',

                cols: [[ //标题栏

             { align: 'center', title: '批次信息', colspan: 6 }

            ,{ align: 'center', title: '药品信息', colspan: 4 }

             ], [

             { field: 'MedicineBath', title: '批号' },

             { field: 'MedicineNum', title: '药品编号', edit: 'text' },

             { field: 'MedName', title: '药品名称', edit: 'text' },

             { field: 'MedicineSpecificat', title: '规格', edit: 'text' },

             { field: 'ResComeCount', title: '库存数', edit: 'text' },

             { field: 'MedicineUnit', title: '单位', edit: 'text' },

             { field: 'MedCost', title: '买入价', edit: 'text' },

             { field: 'MedCostMany', title: '买入金额', edit: 'text' },

                    ]]

 

                , page: {

                    limit: 5,//指定每页显示的条数

                    limits: [5, 10, 15, 20, 25, 30, 35, 40, 45, 50],

                }, //开启分页

                });

 

                layuiTable.on('edit(tabResComeMes)', function (obj) {

                    var data = obj.data;

                    rowdata = data;

                    editvalue = true;

                });

            });

        })

 

这样就实现了在表格里修改数据的办法。下面是它的效果。