数据表在每行调用控制器功能时添加按钮

Question

我正在尝试在Datatable上的每一行上添加“编辑”和“删除”按钮。当我点击“编辑”时，它会调用一个控制器函数，并需要将该行的id作为参数传递。我有问题做得对。有什么建议？

我的控制器

`

def usuarioUpdate():
       return dict(formUsuarioUpdate=crud.update(db.Users,request.args(0)))`

我的看法

    <script>
        var tabla;
    $(document).ready(function(){
           tabla=  $('#tablaGenerica').DataTable({
                    "data":  {{=formListar}},
                    "scrollX": false,
                     "dom": 'lrtip',
                     "searching": true,
                     "sRowSelect": 'single',
                     "language": {
                     "url": "{{=URL('static','js/tradutorTable.json')}}",
                    },
                   "columns": [
                                  {
                                     "class":"details-control",
                                     "orderable":false,
                                     "data":null,
                                     "defaultContent": ""
                                  },
                                  { data: 'users.first_name' },
                                  { data: 'users.last_name' },
                                  { data: 'users.email' },
                                  { data: 'users.username' },
                                  {
                                     "orderable":false,
                                     "data":null,
                                     "defaultContent": "<div class='btn-group btn-group-justified JpositionA'><a class='btn btn-success Jview btn-xs' href='{{=URL('Herramientas','usuarioUpdate',args=["users.id"])}}'><span class='glyphicon glyphicon-pencil'></span></a><a class='btn btn-warning Jview btn-xs' href=><span class='glyphicon glyphicon-remove'></span></a></div>",
                                  },
                              ]
                });
    </script>

<table id="tablaGenerica" class="tablaC table-striped hover cell-border" cellspacing="0" width="100%" >
<thead>
    <tr>
        <th></th>
        <th>Nombre</th>
        <th>Apellido</th>
        <th>Correo Electrónico</th>
        <th>Nombre de Usuario</th>
        <th></th>
    </tr>
</thead>
</table>

Answer 1

作为您的代码，我建议您使用渲染功能来实现目标

 "columns": [
                              {
                                 "class":"details-control",
                                 "orderable":false,
                                 "data":null,
                                 "defaultContent": ""
                              },
                              { data: 'users.first_name' },
                              { data: 'users.last_name' },
                              { data: 'users.email' },
                              { data: 'users.username' },
                              {
                                 "orderable":false,
                                 "data":null,
                                 "render": function(data,type,row,meta){
                                         return "<div class='btn-group btn-group-justified JpositionA'><a class='btn btn-success Jview btn-xs' href='{{=URL('Herramientas','usuarioUpdate',args=["+row.users.id+"])}}'><span class='glyphicon glyphicon-pencil'></span></a><a class='btn btn-warning Jview btn-xs' href=><span class='glyphicon glyphicon-remove'></span></a></div>"
                                 },
                              },
                          ]

关于渲染细节，你可以访问api https://datatables.net/reference/option/columns.render