Answers

• kthorngren Posts: 22,299Questions: 26Answers: 5,127

  December 2021

  Start with this FAQ about speed improvement options.

  Kevin
• user12 Posts: 17Questions: 4Answers: 0

  December 2021

  I have tryen but not work for me
• colin Posts: 15,240Questions: 1Answers: 2,599

  December 2021

  There are a lot of options on that page - what have you tried and what were the results?

  Colin
• user12 Posts: 17Questions: 4Answers: 0

  December 2021

  this is the script

  https://prnt.sc/21kzdae
• user12 Posts: 17Questions: 4Answers: 0

  December 2021 edited December 2021

  @colin i have tryed this script on screenshot. can you sugest me a solution. i cant try every option couse i will slow down my server.
  The result with this script is page stay at reloading

  just to add, i use laravel get() function to fetch all data
• colin Posts: 15,240Questions: 1Answers: 2,599

  December 2021

  With serverSide, you shouldn't be fetching all data, only the records needed for the page being displayed. That would be the place to start. You haven't defined an end-point, so there's nowhere for DataTables to request for that data.

  Colin
• user12 Posts: 17Questions: 4Answers: 0

  December 2021

  And how supose to be script for that?
• user12 Posts: 17Questions: 4Answers: 0

  December 2021 edited December 2021

  i have try and not working for me
  this is the entire script

  ************************
  
  <script>
   $(document).ready( function () {
      $('#dataTableSnd').DataTable( {
      processing: true,
      serverSide: true,
      ordering: false,
      searching: false,
      paging: true,
      lengthChange: false,
      
      "columnDefs": [
          {
              orderable: false,
              className: 'select-checkbox',
              targets: 0
          }
      ],
      select: {
          style: 'multi',
          selector: 'td:first-child'
      },
  
      dom: 'R<"clear">Blfrtip', // import B (for button) dom and R (for reorder) dom
          colReorder: true,
          "oColReorder": {
              "bAddFixed":false
          },
          buttons: [ 
              {
                  extend: 'pageLength',
                  className: 'btn btn-outline-dark rounded'
              },
          @can('user_access') 
              {
                  extend: 'selectAll',
                  // text: '<h4 style="font-size: 12px;"> <i class="fas fa-check-square"></i> Select All </h4>', // Add custom tittle for buttons
                  className: 'btn btn-primary rounded'
              },
              {
                  extend: 'selectNone',
                  className: 'btn btn-secondary rounded'
              },
              {
                  extend: 'copyHtml5',
                  className: 'btn btn-info rounded',
                  exportOptions: {
                      columns: [ 0, ':visible' ],
                      modifier: { search: 'none', selected: true}
                  }
              },
              {
                  extend: 'excelHtml5',
                  className: 'btn btn-success rounded',
                  exportOptions: {
                      columns: [ 0, ':visible' ],
                      modifier: { search: 'none', selected: true}
                  }
              },
              {
                  extend: 'csvHtml5',
                  className: 'btn btn-danger rounded',
                  exportOptions: {
                      columns: [ 0, ':visible' ],
                      modifier: { search: 'none', selected: true}
                  }
              },
              {
                  extend: 'pdfHtml5',
                  className: 'btn btn-warning rounded',
                  exportOptions: {
                      columns: [ 0, ':visible' ],
                      modifier: { search: 'none', selected: true}
                  }
              },
          @endcan
              {
                  extend: 'colvis',
                  className: 'btn btn-light rounded'
              }
          ],
      "scrollY": "100vh",
      scroller: {
              loadingIndicator: true
          },
      "scrollCollapse": true,
      } );
   
      table.buttons().container()
          .appendTo( '#dataTableSnd .col-md-6:eq(0)' );
  } );
  </script>
  *************
  

  i use method get() on laravel to fetch all data. Just to let you know

  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

  December 2021

  You're saying you're fetching all data - so that means serverSide isn't being implemented. For server side processing, enable serverSide. The protocol is discussed here. Also see examples here. If you download the DataTables repo, there are examples of the server-side scripts in /examples/server_side/scripts,

  Cheers,

  Colin
• user12 Posts: 17Questions: 4Answers: 0

  December 2021 edited December 2021

  Hello again i change script as you edited. But this show me an error like this

  DataTables warning: table id=dataTableSnd - Invalid JSON response. For more information about this error, please see http://datatables.net/tn/1

  I try to fetch just 1000 record now.

  Sory for those question. Iam new on this and i dont understand very good how this work.
• user12 Posts: 17Questions: 4Answers: 0

  December 2021 edited December 2021

  This is controller i use i fetch data
  $test = Table::skip(0) ->take(1000) ->get(); // 1000 just for now but will be linke this
  *******$test = Table::all();******

  and this is how i fetch on blade larvel
  <td> {{ $test->id ?? '' }} </td>
• colin Posts: 15,240Questions: 1Answers: 2,599

  December 2021

  Have you followed the steps in the technical notes linked to in the error? That'll be the place to start. If so, what did you find?

  Colin