bootstrap的表格如何添加checkbox同时修改所选行的信息？

上图是我想获得的一个bootstrap表格的界面。
每行都有checkbox，选中后，点击上方的“删除”：删除该行
点击“修改”，该行变为可编辑状态；
点击“添加”：增加一个空行。
我尝试使用jq、bootstrap的时间不长，问题提得琐碎了一些，请指教：
1）我的后端是django，我用 HttpResponse的方式给前端提供python的dict数据，前端生成表格的代码如下：

 {% for data in  dict_top_mv_100.data  %}
   <tr>
       <td>{{data.0}}td>
       <td>{{data.1}}td>
       <td>{{data.2}}td>
       <td>{{data.3}}td>
   tr>
 {% endfor %}

在什么位置添加代码，让每行都有checkbox？

2）如何确定checkbox的选中状态（选择的是哪行）？
谢谢！

你可以在每一行的第一个中添加一个checkbox。 例如:

<td><input type="checkbox" name="selected_rows" value="{{data.id}}"></td>

你可以在点击删除或修改按钮时使用JQuery来获取选中的checkbox的value值，以确定选中的行. 例如:

$("#delete_button").click(function(){
    var selected_rows = $("input[name='selected_rows']:checked").map(function(){
        return $(this).val();
    }).get();
    console.log(selected_rows);
});

这里#delete_button是删除按钮的id

需要注意的是，如果你想要在前端实现删除和修改功能，你需要使用Ajax请求来与后端交互。如果你只是想在前端隐藏选中的行而不是真正删除它们，你可以使用JQuery的hide()函数。

①在tr标签里面的的td标签里面加
②通过checked属性判断是否选中
③在jquery中,可以通过jquery对象.attr("checked")的值是否为true来判断是否选中,若为true 则选中,若为false,则不选中
jquery对象.prop("checked")也行,也是若结果为true则选中,结果为false则不选中