Answers

• rf1234 Posts: 2,808Questions: 85Answers: 406

  August 2020 edited August 2020 Answer ✓

  You can use the DT processing indicator. You can hardly see the thing ... so I rolled my own inidcator with a spinner.

  First you need to set "processing" to true. Either in your DT definition or in the defaults setting. I have it as a default for all of my tables.

  //Data tables default settings
  $.extend( true, $.fn.dataTable.defaults, {
      processing: true
  } );
  

  Then you can also change the defaults for the processing indicator. Mine is using the font awesome spinner.

  $.extend( true, $.fn.dataTable.defaults, {
      "language": {
          "processing": "<span class='fa-stack fa-lg'>\n\
                              <i class='fa fa-spinner fa-spin fa-stack-2x fa-fw'></i>\n\
                         </span>&emsp;Processing ...",
      }
  } );
  

  The above code needs to rune BEFORE DT initialization.

  I use this version of font awesome:

  <!-- Font Awesome -->
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" integrity="sha256-eZrrJcwDc/3uDhsdt61sL2oOBY362qM3lon1gyExkL0=" crossorigin="anonymous" />
  

  In this thread you can see what it looks like and find more information as well:
  https://datatables.net/forums/discussion/comment/161898/

  Here is an alternative to using the DT processing indicator:
  https://datatables.net/forums/discussion/comment/172406/#Comment_172406

  I mostly use busyLoad; it is very easy to use. You can just start the full page spinner when opening the page and when all the loading is done close the spinner.

  I do this for all of my pages:

  $.busyLoadSetup({ fontawesome: "fa fa-spinner fa-spin fa-3x fa-fw" });
  $.busyLoadFull("show");
  

  And on ajaxStop (i.e. when all Data Tables are loaded) I close it. Works everywhere.

  $(document).ajaxStop(function () {
      $.busyLoadFull("hide");
  });
  
• PareshKumar Posts: 31Questions: 14Answers: 1

  August 2020

  This works!! Thanks @rf1234