Answers

• kthorngren Posts: 21,481Questions: 26Answers: 4,978

  July 2022

  Maybe this thread will help. You will need to use jQuery ajax() to fetch the table data instead of Datatables ajax so you can build the columns before DT initializaiotn.

  Kevin
• kthorngren Posts: 21,481Questions: 26Answers: 4,978

  July 2022

  Here is a simple example similar to what is in that thread:
  http://live.datatables.net/huyexejo/1/edit

  Kevin
• jstuardo Posts: 104Questions: 41Answers: 0

  July 2022

  Thanks @kthorngren. Now, how can I pass the parameters that datatable sends automatically which includes filter and sort information? For example, something similar to other grids I have in my system:

  draw: 1
  columns[0][data]: grupoServicio
  columns[0][name]: 
  columns[0][searchable]: true
  columns[0][orderable]: true
  columns[0][search][value]: 
  columns[0][search][regex]: false
  columns[1][data]: servicio
  columns[1][name]: 
  columns[1][searchable]: true
  columns[1][orderable]: true
  columns[1][search][value]: 
  columns[1][search][regex]: false
  columns[2][data]: cantidad
  columns[2][name]: 
  columns[2][searchable]: true
  columns[2][orderable]: true
  columns[2][search][value]: 
  columns[2][search][regex]: false
  columns[3][data]: valorUnitario
  columns[3][name]: 
  columns[3][searchable]: true
  columns[3][orderable]: true
  columns[3][search][value]: 
  columns[3][search][regex]: false
  columns[4][data]: valorTotal
  columns[4][name]: 
  columns[4][searchable]: true
  columns[4][orderable]: true
  columns[4][search][value]: 
  columns[4][search][regex]: false
  order[0][column]: 1
  order[0][dir]: asc
  start: 0
  length: 10
  search[value]: 
  search[regex]: false
  

  The ajax function is prepared to receive all that object in order to filter and sort accordingly.

  On other grids with fixed columns, I refresh the grid using tabla.search(searchQuery).draw();, where tabla is the datatable.

  How can I do that in this case?
• kthorngren Posts: 21,481Questions: 26Answers: 4,978

  July 2022 Answer ✓

  The process will be similar. The URL you go to in the jQuery ajax() request should just return the column names, not any row data. Then initialize your Datatables as normal in the success function. For example:
  http://live.datatables.net/qimukefe/1/edit

  This example uses the same URL as Datatables is configured for:

      $.ajax({
        url: "/ssp/objects.php",
  

  But you will want something different that just returns the column - no data.

  Kevin
• jstuardo Posts: 104Questions: 41Answers: 0

  July 2022

  Thanks @kthorngren, it worked, however, something is left and is concerning grid refresh.

  I have created a getReport() function that gets the columns and then create the DataTable object.

  Now, the problem I am having is when the filter is changed. I have a modal dialog box allowing to choose a different date range.

  On other pages, where all columns are fixed, I just call tabla.search(advancedSearchQuery).draw();.

  In this case, with dynamic ones, I have replaced that call with a call to getReport(). The new columns are retrieved correctly, but the DataTable is not repainted in order to show the new columns corresponding to the new date range.

  Inside the getReport() function I am using tabla = $('#report').DataTable({ .... }); to create the DataTable. I think repainting is not performed since the object is already created. Should I destroy the DataTable first before recreating? how can I do that?

  Thanks again
• kthorngren Posts: 21,481Questions: 26Answers: 4,978

  July 2022 Answer ✓

  Should I destroy the DataTable first before recreating? how can I do that?

  YEs, to make changes to the columns you need to destroy the Datatable. Use the destroy() API. See the examples in the docs. You may want to use the DataTable.isDataTable() to make sure the Datatables exists before destorying.

  Kevin
• jstuardo Posts: 104Questions: 41Answers: 0

  July 2022

  Perfect! it worked!

  Thanks
  Jaime