实现layui数据表单添加行功能(最新解决办法)
这个解决方案分两种情况
1.如果你的table中并没有url,那么这个很好解决,先获取到目前table中的数据,然后添加一行,在重新加载一下就可以了
var dataBak = []; //定义一个空数组,用来存储之前编辑过的数据已经存放新数据 var tableBak = table.cache.stock_add_table; //获取之前编辑过的全部数据,前提是编辑数据是要更新缓存,stock_add_table 为表格的id for (var i = 0; i < tableBak.length; i++) { dataBak.push(tableBak[i]); //将之前的数组备份 } 在尾部新增一行空数据,实现增行效果 dataBak.push({ "stockInCargo": "" ,"stockInNum": "" ,"stockInPrice": "" ,"stockCargoTime": "" ,"stockInCompany": "" }); table.reload("stock_add_table",{ data:dataBak // 将新数据重新载入表格 })
2.如果你的table中是通过url访问的,那么这种方法就不行了,以为reload会重新调用url中的方法,我们可以通过where的方式拼接参数来通过后台数据添加列
-
前台代码:
table.reload("test",{ url:http://localhost:10002/customer/get, where:{ type:add}//通过where拼接参数 });
-
后台代码:
public Result getCustomer(int page,int limit,String type){ PageInfo<Customer> customers = customerService.getCustomers(page,limit); CustomerVo customerVo = new CustomerVo(); customerVo.setCount(customers.getTotal()); List<Customer> list = customers.getList(); //通过参数判断是否要多添加一行 if(type.equals("add")){ Customer customer = new Customer(); list.add(customer); } customerVo.setCustomerList(list); return ResultUtil.success(customerVo); }