0

I'm trying to fill the datatable with values comes from a server, I don't use the datatable's ajax function because I use the values also in other parts of the page. I have already use this type of fullfill but I don't understand why in this case nothing happen, the table remain empty. I have tried to check if the values exists and yes, so there is something wrong in the configuration maybe ... but what ? Here my code:

var datas = [];             
$.ajax({
        url: getServer(FN_SERVER),
        success: function(resp) {
            for(var i=0;i<resp.data.length;i++) {
                campaigns[resp.data[i].id] = resp.data[i];
                var elem = []
                elem.push(resp.data[i].id);
                elem.push(resp.data[i].desc.trim());
                elem.push(resp.data[i].ccode.trim());
                elem.push(resp.data[i].scode.trim());
                elem.push(resp.data[i].ecode.trim());
                datas.push(elem);
            }
        }
});
var cols = [
            {"title":"id"},
            {"title":"desc"},
            {"title":"ccode"},
            {"title":"scode"},
            {"title":"ecode"},
            { "render": function(data, type, row) {
                  return "<input type='image' title='Info' src='"+getContextPath()+"/images/info.png' onclick='campagne.showInfo(this)'>";
                },
                "orderable": false,
                "class":"align_center"
            },
            { "render": function(data, type, row) {
                   return "<input type='image' title='Conf' src='"+getContextPath()+"/images/settings.png' onclick='campagne.showUpdateCamp(this)'>";
                 },
                 "orderable": false,
                 "class":"align_center"
            }
          ];
var table = $("#table").dataTable({
                "scrollY": "300px",
                "scrollX": true,
                "bSort": false,
                "orderMulti": false,
                "searching": false,
                "paging": false,
                "bInfo": false,
                "columns": cols,
                "data": datas,
                "language": {
                    "emptyTable": NORECORD,
                    "zeroRecords": NORECORD
                },
                "drawCallback": function() {
                }
            });
Storm
  • 73
  • 1
  • 1
  • 12
  • 1
    The AJAX call is *asynchronous*, so your `datas` array is not filled until *after* you set it as the source of the Datatable. You need to place all logic that relies on the result of the AJAX request *within* the `success` handler. – Rory McCrossan Oct 25 '17 at 09:12
  • Thank you man, you have right, the classic error that you know but you don't see ... – Storm Oct 25 '17 at 10:01

0 Answers0