问题描述：

rails 前端通常有很多列表，譬如 books 的 index 页面，查询后的显示结果页面等等，都有多个实例，如果要从多个实例中选取一部分实例，提交到后台进行进一步的处理，譬如提交到后台进行删除、作为附件转发等等，就会利用 check_box 从前端选取实例，这个时候要把 check_box 的 value 值的集合，作为参数，通过 form 提交到后端，让后端的 controller 读取。 通常的做法是利用 form 包裹参数，通过 form 的 submit 提交，在 form_tag 中指明提交的路径、method 等等。这个时候就有一个问题： 如果选取的实例，有时候是提交到后台删除，有时候是提交到后台作为附件转发，有时候是提交到后台批量下载，每个 form 对应的路径、method 等相关内容都不相同，难道要使用多个 form_tag？而且 form_tag 的 submit 按钮通常在底部，如果要把按钮设置在 form 外面，譬如页面顶部，这样也存在一些页面处理问题。

总之，处理不好会导致前端结构混乱，能否实现实例选取功能和提交功能分开，不同的 button 按钮，自动提交到不同的后台处理？

解决方案：

搜索了很多的解决方案，包括 button_to 等都不理想，解决一个 form_tag 提交还好说，一个页面解决多个提交，就会出现页面处理混乱。 最终决定用 JavaScript 来解决，思路是：使用 JavaScript 读取页面所有的 check_box 的 value，如果不为空，就存在一个数组里边，然后将该数组作为参数，由不同的 form_tag 提交。

读取 check_box 的 value 并实现 form 提交的代码

function submitform(form_name){
   var obj = document.getElementsByName("patent[files][]");
 //check_box被命名为了"patent[files][]"
   var check_val = [];
    for (k in obj) {
        //判断复选框是否被选中
        if (obj[k].checked)
            //获取被选中的复选框的值
            check_val.push(obj[k].value);
    }
    document.getElementById("files_id").setAttribute('value', check_val);
//将files_id在form中设置一个不显示的input数据，其value值设置为使用JavaScript读取页面所有的check_box的value的数组集合值，该值随着form提交
    document.getElementsByName(form_name)[0].submit();
  //为什么不用form_id来查找元素？因为form_tag中的form的id的值，用JavaScript不好读取，存在一个rails变量和JavaScript变量相互读取的难题

}

</script>

新建一个 form，专门用于指明提交的路线，方法，该 form 不设置 submit 按钮（这样的 form 可以根据需要建很多个，对在前端页面的位置也没有太高的要求）

<%= form_for(@patent, url: destroy_files_patent_path(@patent), html: { name: "destroy_files_submit", method: "delete",}) do |form| %>
 <input type="hidden" id="files_id" name="files_id" value= ""  >    
<% end %> 

新建一个 button，专门用于提交

<button onclick="submitform('destroy_files_submit')" class="btn btn-outline-secondary">删除选中</button>
//onclick= 用于执行submitform这个函数

小结

通过上述处理，用 JavaScript 函数来读取 check_box 参数值给到 form_tag 用于提交（其实也可以根据需要，通过调整 document.getElementById，调整为读取其他的前端页面所需要的值），然后再根据需要传递到后端，解决了 form_tag 与前端页面部分太过于深度耦合的问题，灵活性大大增加。从此打通前后端参数搜集传递的任督二脉，浑身舒爽，而涉及到的 JavaScript 代码并不多，难度也能理解，甚至在 JavaScript 代码中也能进一步增加参数的校验功能。

以上是几天来的摸索结果，以为记。