Answers

• kthorngren Posts: 21,309Questions: 26Answers: 4,947

  August 13

  The JSON response looks like this:

  

  See Allan's answer in this thread. You will need to change the JSON response to use these SSP response parameters.

  Kevin
• jdadwilson Posts: 127Questions: 30Answers: 1

  August 14

  Kevin; I made the following change to the $output array...

  $output = array( "draw" => 1, "recordsTotal" => 100, "recordsFiltered" => 100, "data" => array() );
  

  Change the code accordingly.

  Updated the js code as follows...

  function load_Table() {
      oTable = new DataTable('#mainTable', {
          ajax: 'assets/ajax/ajax_Markers.php',
  
          columns: [ { data: 'mkr_name',  className: 'udatal', orderable: false, visible: true },
                     { data: 'mkr_town',  className: 'udatal', orderable: false, visible: true },
                     { data: 'mkr_id',    className: 'udatar', orderable: false, visible: false } ],
  
          pageLength: 14,
  
          processing: true,
  
          serverSide: true
      });
  }
  

  Added the two referenced scripts to my java loader script.

  Noted two problems...
  1. The pageLength 14, option has no effect on the number of records to display. The output was 100 records.
  2. An error "Cannot read properties of undefined (reading 'Api')" was thrown on line 72 of alphabetSearch.

  Here is the link to the test case... Historical Markers.

  jdadwilson
• jdadwilson Posts: 127Questions: 30Answers: 1

  August 14

  Well, I don't know what exactly is happening except that not only the one module I changed (markers) but all of the modules in the whole site will now not load.

  Same two errors as on the 'markers' module.

  Here is the code for my java loader...

  <!-- Primary javascripts for all pages -->
  
  <script src="https://code.jquery.com/jquery-1.12.3.min.js"></script>
  <!--
  <script src="https://code.jquery.com/ui/1.13.3/jquery-ul.js"></script>
  -->
  
  <!-- dataTables java Script >
  <script src="java/vendor/datatables-2.2.js"></script>       
  <script src="java/vendor/datatables-globals.js"></script
  <script src="https://cdn.datatables.net/2.1.3/js/dataTables.js"></script>-->
  
  <!--
  These files are used for the DataTables example for problem 
  <script src="https://code.jquery.com/jquery-3.7.1.js"></script>
  <script src="https://cdn.datatables.net/2.1.3/js/dataTables.js"></script>>-->
  
  <script src="java/vendor/vendor-datatables-2.0.8.js"></script>
  <script src="java/vendor/vendor-alphabetSearch-2.0.js"></script>
  <script src="java/vendor/<?php echo CO_NAME_LONG;?>-datatables-globals.js"></script>
  
  <!-- Bootstrap 3.3.6 Script -->
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
  
  <script src="https://code.jquery.com/jquery-3.7.1.js"></script>
  <script src="https://code.jquery.com/jquery-migrate-1.4.1.js"></script> 
  
  <!-- Leaflet javascript file v1.9.3 -->
  <script src="https://unpkg.com/leaflet@1.9.3/dist/leaflet.js" integrity="sha256-WBkoXOwTeyKclOHuWtc+i2uENFpDZ9YPdf5Hf+D7ewM=" crossorigin=""></script>
  
  <!-- Special bootBox Script -->
  <script src="java/vendor/vendor-bootbox.4.4.0.min.js"></script>
  <script src='https://api.mapbox.com/mapbox.js/plugins/leaflet-fullscreen/v1.0.1/Leaflet.fullscreen.min.js'></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/leaflet-ajax/2.1.0/leaflet.ajax.min.js" type="text/javascript"></script>
  

  Note that some groups are commented out. Should one of them be active.

  jdadwilson
• allan Posts: 63,471Questions: 1Answers: 10,467 Site admin

  August 14

  The pageLength 14, option has no effect on the number of records to display. The output was 100 records.

  That suggests that your server-side processing script is returning 100 rows. You might want to read over this part of the manual to check if you want server-side processing or client-side. If server-side, then your server-side script is responsible for paging, sorting and filtering.

  An error "Cannot read properties of undefined (reading 'Api')" was thrown on line 72 of alphabetSearch.

  Your page is loading jQuery multiple times:

  <script src="https://code.jquery.com/jquery-1.12.3.min.js"></script>
  

  and

  <script src="https://code.jquery.com/jquery-3.7.1.js"></script>
  

  The second one overwrites the first (which has the DataTable object attached to it).

  You also appear to be loading the alphabet search plugin multiple times.

  Allan
• jdadwilson Posts: 127Questions: 30Answers: 1

  August 14

  Thanks for the update. That fixed the problem. I think I need to use the client-side processing. I only have one table with over 100,000 records but all the loads from it will only select a subset of the total.

  Thanks for your great support!
  jdadwilson