我需要在ajax动作后刷新数据表

时间:2018-01-15 16:16:00

标签: javascript jquery ajax datatable

我需要在ajax动作之后刷新数据表,我已经尝试了我发现的所有内容并且没有任何帮助,数据表手册说要使用table.api()。ajax.reload();但是我无法做到这一点,也试图摧毁数据并再次渲染它并且不起作用,请我帮忙。

这是我的代码:

var form=document.getElementById("formEditMantenimientoRolDetails");
var formData = new FormData(form);
$.ajax({
    url: '{{ path('editRolMantenimiento') }}',
    type: 'POST',
    data: formData,
    cache: false,
    contentType: false,
    processData: false,
    success: function (returndata) {
        if (returndata.success == true) {
            $.unblockUI();
            $('#editRol').modal('hide');
            Notificacion("success", "Valoración RP", "Los datos se han guardado correctamente.");
            $('#sample_2').load(window.location + ' #sample_2 >  *');
        }
    }
})

此行($('#sample_2').load(window.location + ' #sample_2 > *');)有效,但我丢失了可排序表。

修改

我的桌子:

<table class="table table-striped table-bordered table-hover" id="sample_2">
   <thead>
       <tr class="header">
           <th class="table-checkbox noprint">
               <input type="checkbox" class="group-checkable" data-set="#sample_2 .checkboxes" disabled/>
           </th>
           <th width="20%" style="text-align:center;" onclick="sortTable(1)">
               Rol aplicación
           </th>
           <th width="20%" style="text-align:center;" onclick="sortTable(2)">
               Descripción del rol
           </th>
           <th width="20%" style="text-align:center;" onclick="sortTable(3)">
               Nivel de Permiso
           </th>
           <th width="20%" style="text-align:center;" onclick="sortTable(4)">
               Estado
           </th>
           <th width="20%" class="noprint" style="text-align:center;">
               Acciones
           </th>
       </tr>
   </thead>
   <tbody id="tablaIndexRol">
       {% for rol in rol %}
       <tr class="odd gradeX">
           <td class="noprint">
               <input type="checkbox" class="checkboxes" disabled/>
           </td>
           <td style="text-align:center;">
               {{ rol.rol }}
           </td>
           <td style="text-align:center;">
               {{ rol.descripcion }}
           </td>
           <td style="text-align:center;">
               {{ rol.permiso.nombre }}
           </td>
           <td style="text-align:center;">
               {% if rol.enabled == 1 %}
               Activo
               {% else %}
               Inactivo
               {% endif %}
           </td>
           <td class="noprint" style="text-align:center;">
               <a class="btn btn-sm default" data-toggle="modal" onclick="showMantenimientoRol({{rol.id}})">Ver</a>
               <a class="btn btn-sm blue" data-toggle="modal" onclick="editMantenimientoRolDetails({{rol.id}})">Editar</a>
           </td>
       </tr>
       {% endfor %}
   </tbody>
</table>

感谢。

1 个答案:

答案 0 :(得分:0)

要重新加载数据表,我使用了这个:

$(document).ready(function () {
    var DataTable = $('#dataTable').DataTable({
        // insert datatable commands here
    });

然后,重新加载,

DataTable.ajax.reload();

您的代码显示没有.DataTable({})函数,因此您需要添加。