html 从服务器到Datatable插件1.10的半异步数据

Posted 2021-05-11

<!--
This is a another example when use a Datatable add
-->
<script>
  var oTable;
  var t_body;
  $(function(){
    t_body = $('#tabla tbody');
    oTable = $("#tabla").DataTable({
        'dom': "<'row'<'col-sm-3'l><'col-sm-5'f><'col-sm-4 text-right'B>>"+
                "<'row'<'col-sm-12'tr>>" +
            "<'row'<'col-sm-5'i><'col-sm-7'p>>",
        'buttons': [
            {
                text: '<i class="fa fa-plus-square"></i> Crear encuesta',
                className : 'btn btn-default btn-sm',
                action: function(e, dt, node, config){
                    modalEncuesta.modal('show');
                },
            }
        ],
        'columns': [
            {data: "id"},
            {data: "nombre"},
            {data: "descripcion"},
            {data: "action"}
        ]
    });
    
    encuestas();
    function encuestas() {
      $.ajax({
          url: "URL_TO_SERVERG_GET_JSON",
          type: 'get',
          dataType: 'json',
          beforeSend: function () {
              pleasewait();
          },
          success: function (response) {
              initializeDataTable(response.data);
          },
          error: function () {},
          complete: function () {
              unpleasewait();
          }
      });
    }
    
    function initializeDataTable(data) {
        $.each(data, function (i, v) {
            v.id = i + 1;
            v.action = "Here some buttons";
            oTable.row.add(v);
        });
        oTable.draw();
    }
  });
</script>