bootstrap-table+多行数据组合提交（java版）_bootstrap-table所有内容提交-CSDN博客

本文链接：https://blog.csdn.net/weixin_37620246/article/details/77895450

1、bootstra-table插件介绍
Bootstrap-table是一个基于bootstrap样式的表格组件，可以通过简单的配置，即可以动态生成表格，从而方便使用。

2、bootstrap-table的自带编辑x-editable插件
bootstrap-table含有一个附带的js插件，x-editable，这个插件的主要思想，是提供行内编辑，就是每行作为一个对象，然后提交给后台进行更改数据，这样的更改的，可能需要触发的后台请求次数太过于频繁，所以改成批量数据请求到后台，所以这个插件不是很适用，不过有兴趣的同学还是可以看看这个插件的实现的。
JS组件系列——BootstrapTable 行内编辑解决方案：x-editable

3、间接生成可编辑表格

function operateFormatterApplyQuanlity(value, row, index) {//赋予的参数
    return [
                '<input type="text" flag="aq" id="aq'+row.id+'"  value="'+ row.applyQuanlity +'" />'
                +'<input type="hidden" flag="id" id="id'+row.id+'" value="'+ row.id +'" />'
        ].join('');
        };

上面的代码是对将表格数据格式化成一个input标签，但要记得的是，还需要在对应的字段上面配置上面那个operateFormatterApplyQuanlity；
如下所示：

{
        field: 'applyQuanlity',
        title: '申请数量',
        align: 'center',
        formatter: operateFormatterApplyQuanlity //自定义方法格式化
},

配好上面的东西后，我们表格输出的就会像下面这样了
这里写图片描述

4、用from标签包裹整个表格
接下来，我们用from包裹整个表格，然后根据复选框被选中的行，然后在对应的每一行里面的需要更改数据的input标签内添加一个name属性，这是js操作，这里我只给出一个思路，代码太长，就不贴了，然后，将选中的行的中的id列也添加一个name属性，然后再提交整个表单，后台用request.getParameterValues(String name)获取数组属性，然后再在后台默默处理呗。