Answers

• kthorngren Posts: 21,330Questions: 26Answers: 4,951

  January 2023 edited January 2023

  Looks like the response contains the Datatables config. Can you post the contents so we can see how you are defining the buttons?

  I cross-checked that all required files were added.

  Please post the files you are including. Also make sure there aren't any errors loading the files when the page is loaded.

  Kevin
• Rashid U Posts: 7Questions: 1Answers: 0

  January 2023

  The JSON Response as follows,

  {"activity_name":"APF- Seed treatment support to Women farmers",

  "data":[
  [1,"Dhanpur","Bhorva","Babudiben,ramsingbhi","Bhabhorramsingbhi","NA","Rabi","Description","2022-12-21"],
  [2,"Dhanpur","Bhorva","Baria liltaben,rangitbha","Rangitbhai","NA","Rabi","Description","2022-12-21"],[3,"Kadana","Aatalwada","Amdaben","Mangal Bhai","Budget","Zaid","Yes","2023-01-05"]],
  "columns":[["#"],["Block"],["Village"],["Individual"],["Family"],["Budget line item (if Non - Budgeted please write NA)"],["Season"],["Activity Description"],["Date"]]}

  The table loads perfectly with the data & column head as shown above

  The buttons configuration as follows,

  $("#table-div").append('<table id="displayTable" class="table table-striped table-hover table-bordered data-table" cellspacing="0" width="100%"><thead class="table-dark"><tr>' + tableHeaders + '</tr></thead><tbody></tbody></table>');
                          $('#displayTable').dataTable(response,{
                              dom:Bfrtip,
                              buttons: [
                                  'copy', 'excel', 'pdf'
                              ]
                          });
  

  I have added the all required files. because the button shows when the table initialise normal way (means without appending through AJAX response). Still confused?. I am glad to share more details. any help will really appreciated.
• colin Posts: 15,240Questions: 1Answers: 2,599

  January 2023

  The dom is a string, so "Bfrtip" needs to be quoted, something like:

     dom: 'Bfrtip',
  

  If that doesn't help, we're happy to take a look, but as per the forum rules, please link to a test case - a test case that replicates the issue will ensure you'll get a quick and accurate response. Information on how to create a test case (if you aren't able to link to the page you are working on) is available here.

  Cheers,

  Colin
• Rashid U Posts: 7Questions: 1Answers: 0

  January 2023 edited January 2023

  Hi Colin, Thanks for your reply. Still, I have some difficulties to share the URL, because it is live and now I am working on my local host which can't access it remotely. so please do one thing. I will share the JSON response format and please tell me how can I configure the button while appending this response.

  "data":[[1,"A","B","C"],[2,"D","E","F"],[3,"G","H","I"]] and "column": [["ID"],["coloumn1"],["coloumn2"],["coloumn3"]]

  Because the column title is dynamic and can't be predefined. so both column titles and each row display perfectly. when trying to put the export button, nothing will display there. the AJAX success response is shown below

                          var tableHeaders='';
                      
                          $.each(response.columns, function(i, val){
                              tableHeaders += "<th>" + val + "</th>";
                          });
                      
                          $("#table-div").empty();
                          $("#table-div").append('<table id="displayTable" class="table table-striped table-hover table-bordered data- 
                         table" cellspacing="0" width="100%"><thead class="table-dark"><tr>' + tableHeaders + '</tr></thead> 
                          <tbody></tbody></table>');
  
                          $('#displayTable').dataTable(response,{
                              dom:'Bfrtip',
                              buttons: [
                                  'copy', 'excel', 'pdf'
                              ]
                          });
  

  If possible please give me a solution, or I will share the live URL.
• allan Posts: 63,498Questions: 1Answers: 10,471 Site admin

  January 2023

  It seems to work just fine for me: http://live.datatables.net/tewujaru/1/edit .

  Allan
• Rashid U Posts: 7Questions: 1Answers: 0

  January 2023

  Hello @allan

  I don't know how to say thank you. this is the first time I am asking for help from such a big forum and got a response within a couple of hours. this is amazing.

  Again thank you so much @allan @colin and @kthorngren .
• allan Posts: 63,498Questions: 1Answers: 10,471 Site admin

  January 2023

  The file still has the UTF-8 BOM. At least in the link you gave above.

  Allan
• Rashid U Posts: 7Questions: 1Answers: 0

  January 2023

  Sorry, I didn't get you.
• allan Posts: 63,498Questions: 1Answers: 10,471 Site admin

  January 2023

  As in I downloaded the file from your site again and it still has the UTF-8 BOM, which is why it is still giving an error.

  Allan
• Rashid U Posts: 7Questions: 1Answers: 0

  January 2023 edited January 2023

  @allan
  The problem is solved. and I don't know which file/link you are referring to. sorry.!
• allan Posts: 63,498Questions: 1Answers: 10,471 Site admin

  January 2023 Answer ✓

  Nevermind - good to hear you've got it working.

  Allan
• Rashid U Posts: 7Questions: 1Answers: 0

  January 2023

  The solution you mentioned here: [link](http://live.datatables.net/tewujaru/1/edit . "link") worked for me. thank you @allan