保存layui表格里input标签的数据
上次写到了在layui表格里面加入input标签, 并且设置input标签的类型为时间格式,使数据顺序整齐排列在表格里,并且可以在layui表格里同时对多条数据进行编辑。
那么,现在,问题又来了:如何同时保存在layui表格里面编辑的多条数据呢?
在创建table标签时,我给它套了一个form表单,layui表格里面的input标签也按照form表单里面的input标签的格式设置了对应的name。所以,layui表格里面的数据就如同form表单里面的数据一样,可以被序列化出来。
从上图,我们可以看到,被序列化出来的21条input标签的数据,其中每一条数据都有其他几条name是相同的数据,但是,细心观察,你会发现,这些数据都是按顺序排列的,并且如同你在layui表格排列数据的顺序一样。(仅限添加了input标签的)
如果将数据就这样通过“post”提交到控制器,控制器只会读取到表格的第一行数据,无法同时读取多条数据。
既然控制器无法同时读取多条数据,我就想到在把数据在通过post提交之前先处理一下,把layui表格的数据一行一行地提交出来。
前面也提到,被序列化出来的数据都是虽然很多name相同,但数据排列规律。仔细观察上图中的21条name,你可以发现,这些数据每7条为一组,即相当于每7条为layui表格的一行数据。那么,我就想到,是不是可以把数据分开提交,按照上图数据排列的规律,一次获取7条提交保存。
先通过序列化方法将layui表格的数据全都获取到,然后判断是否有数据,没有就弹出提示;然后分别为每一个name都声明一个字段接收数据,再声明一个字段记录提交数据的次数。然后通过for循环将序列化出来的数据一行一行地循环获取。这里我用到了一个正则表达式,这个正则的意思是只可以输入0和非0开头的整数。上面说过数据每7条为layui表格的一行数据,所以 一次要获取7条,而序列化出来的数组的长度也是7的倍数,所以,在for循环里面,将代表条数的i除