DataTable is not initialized when returned data is empty

We have a dynamic set up of DataTable v1.10.20 to initialize a datatable event if data is empty as it will be filled up with specific data when the select option is selected.

Now we updated jQuery version to 3.7 and DataTable v2.0.6 and somehow the table is stuck on displaying process/loading with length menu and search option on top displays fine.

DataTables 2.0.6, Buttons 3.0.2, Responsive 3.0.2, RowReorder 1.5.0, Select 2.0.1

response: {"draw":0,"recordsTotal":0,"recordsFiltered":0,"data":[]}

window.tableInit = function()
  {
  var $table = $('#tableId')
    .DataTable(
      { paging     : true
      , serverSide : true
      , searching  : true
      , pageLength : 10
      , responsive : true
      , processing : true
      , pagingType : 'simple_numbers'
      , lengthMenu : [[5, 10, 25, 50],[5, 10, 25, 50]]
      , ajax       : { url: 'url here', type: 'POST' }
      , columns: 
        [ { data: 'id'    }
        , { data: 'image' }
        , { data: 'name'  }
        , { data: null    } ]
      , sDom       : 'dom structure'
      , bSort      : true
      , columnDefs: 
        [ { width:  '5%', targets: 0 } 
        , { width: '20%', targets: 1 } 
        , { width: '50%', targets: 2 } 
        , { targets: [ 1, 2] , bSortable: false } 
        , { responsivePriority: 1, targets:  0 } 
        , { responsivePriority: 2, targets: -1 } 
        , { targets : -1
          , data    : null
          , mRender : function( data, type, full )
            { 
          return `<div>
                    <button class="btn btn-success btn-order" title="Select">
                      <i class="fa fa-search"></i>
                    </button>
                  </div>`;
          }
        , bSortable : false
        , sClass    : 'dtActionCls'
        }
      ]
    }
  ).columns.adjust().responsive.recalc();
    
  return $table;
  }

var $listTable = tableInit();

$("#tableId").on("init.dt", function()
  {

  // this part doesn't get appended on top of the table
    
  $("#tableId_wrapper .filter .selection")
  .html('<div class="selection"><select><option value="" selected>Select</option><option value="option1"></option<option value="option2"></option></select></div>');
  });

The issue is on the php code back end as the 'draw' value is hard coded equal to 0. My co-developer on the back end change it to be dynamic, getting the request value for 'draw'