Answers

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

  January 2022

  You loading the table into the DOM then initializing Datatables. See this FAQ about options to improve performance.

  Kevin
• satyriasis Posts: 30Questions: 7Answers: 0

  January 2022

  Can you please explain which one of these is best option for me? Also, how to add it to the code here?```

  jQuery(document).ready( function () { jQuery('#ana1').DataTable({ responsive: true, language: { url: '//cdn.datatables.net/plug-ins/1.11.3/i18n/hr.json' }, dom: 'Bfrtip', buttons: [ { extend: 'copy', className: 'nectar-button medium regular extra-color-1 regular-button tableBtn' }, { extend: 'csv', className: 'nectar-button medium regular extra-color-1 regular-button tableBtn' }, { extend: 'excel', className: 'nectar-button medium regular extra-color-1 regular-button tableBtn' }, { extend: 'print', className: 'nectar-button medium regular extra-color-1 regular-button tableBtn' } ] }); });

  <style>
  .dataTables_filter input {
  margin-bottom: 30px;
  }
  </style>```
• allan Posts: 63,498Questions: 1Answers: 10,471 Site admin

  January 2022

  I’d suggest Ajax loading with deferRender enabled.

  Allan
• satyriasis Posts: 30Questions: 7Answers: 0

  January 2022 edited January 2022

  Can someone suggest me how to include code for ajax into my code?

  What I need to add (based on above sugesstion

  $('#example').dataTable( {
    "ajax": "sources/arrays.txt",
    "deferRender": true
  } );
  

  What I have now:

  <script>
  jQuery(document).ready( function () {
    jQuery('#ana1').DataTable({
      responsive: true,
      language: {
        url: '//cdn.datatables.net/plug-ins/1.11.3/i18n/hr.json'
        },
        dom: 'Bfrtip',
        buttons: [
          { extend: 'copy', className: 'nectar-button medium regular extra-color-1 regular-button tableBtn' },
          { extend: 'csv', className: 'nectar-button medium regular extra-color-1 regular-button tableBtn' },
          { extend: 'excel', className: 'nectar-button medium regular extra-color-1 regular-button tableBtn' },
          { extend: 'print', className: 'nectar-button medium regular extra-color-1 regular-button tableBtn' }
        ] 
    });
  });
  </script>
  

  Everything I try is wrong, I dont have any experience in this, please help me

  Edited by Colin - Syntax highlighting. Details on how to highlight code using markdown can be found in this guide.
• colin Posts: 15,240Questions: 1Answers: 2,599

  January 2022

  You just need to add the ajax into the list of options, so something like:

    jQuery('#ana1').DataTable({
    "ajax": "sources/arrays.txt",
    "deferRender": true,
      responsive: true,
     ...
  

  Colin
• satyriasis Posts: 30Questions: 7Answers: 0

  January 2022 edited January 2022

  **This gives me error in browser: DataTables warning: table id=ana1 - Ajax error. For more information about this error, please see http://datatables.net/tn/7**

  What I done:

  <link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/v/dt/jszip-2.5.0/dt-1.11.3/b-2.1.1/b-html5-2.1.1/b-print-2.1.1/r-2.2.9/datatables.min.css"/>
  <script type="text/javascript" src="https://cdn.datatables.net/v/dt/jszip-2.5.0/dt-1.11.3/b-2.1.1/b-html5-2.1.1/b-print-2.1.1/r-2.2.9/datatables.min.js"></script>
  
  
  <script>
  jQuery(document).ready( function () {
   jQuery('#ana1').DataTable({
  "ajax": "sources/arrays.txt",
  "deferRender": true,
      responsive: true,
      language: {
        url: '//cdn.datatables.net/plug-ins/1.11.3/i18n/hr.json'
        },
   dom: 'Bfrtip',
        buttons: [
          { extend: 'copy', className: 'nectar-button medium regular extra-color-1 regular-button tableBtn' },
          { extend: 'csv', className: 'nectar-button medium regular extra-color-1 regular-button tableBtn' },
          { extend: 'excel', className: 'nectar-button medium regular extra-color-1 regular-button tableBtn' },
          { extend: 'print', className: 'nectar-button medium regular extra-color-1 regular-button tableBtn' }
        ] 
    });
  });
  </script>
  

  Do I need to delete dom: 'Bfrtip', or maybe some of bracquets });?
• kthorngren Posts: 21,336Questions: 26Answers: 4,951

  January 2022

  Follow the troubleshooting steps provided in the error link:
  http://datatables.net/tn/7

  Likely the server is responding with an error. You will need to check the server logs to find the problem.

  Kevin
• satyriasis Posts: 30Questions: 7Answers: 0

  January 2022

  I am quite sure I didnt paste Colins code properly. When I put it to old state everything works fine, but loads slowly. Do I need to remove dom: 'Bfrtip',or maybe some of bracquets });?
• kthorngren Posts: 21,336Questions: 26Answers: 4,951

  January 2022 edited January 2022

  Do I need to remove dom: 'Bfrtip',or maybe some of bracquets });?

  No.

  "ajax": "sources/arrays.txt",

  You have this. Do you have a web server to respond to the ajax request?

  If you are not familiar with ajax see this tutorial.

  Kevin
• satyriasis Posts: 30Questions: 7Answers: 0

  January 2022

  I am sorry, kthorngren , even after reading this link, I dont understand your question. I am really a beginner asking for a help, and If I fix this, it would be my final step and all of my struggles would be finished...
• satyriasis Posts: 30Questions: 7Answers: 0

  January 2022

  What ever I try I get this error message (check on link https://masinko.hr/baza-podataka-adrese/?nocache=1). I really dont know what is a web server to respond, can you suggest me what to write in code?
• kthorngren Posts: 21,336Questions: 26Answers: 4,951

  January 2022

  really dont know what is a web server to respond, can you suggest me what to write in code?

  Maybe this What is a web server tutorial might help. Choosing what to use is beyond the scope of this forum. Stack Overflow is a better place to ask questions about choosing and setting up a web server.

  Once setup the web server will will respond to the ajax request with the table data.

  Kevin