jquery-KivaSort options

This example demonstrates how to pass options to DataTables (in this case, 'pageLength', 'scrollX', and 'order'). The order attribute causes the table's default sort order to be Portfolio Yield and then Profitability in descending order. It also uses the DataTables API (the columns() and search() functions) to filter out rows which don't have any Portfolio Yield or Profitability data. The effect is a small table which makes it easy to find the field partners with the highest interest rates.

by cristoper

HTML

<!DOCTYPE html>
<html>
<head>
  <link rel="stylesheet" href="//cdn.datatables.net/1.10.10/css/jquery.dataTables.min.css">

  <meta charset="utf-8">
  <title>Kiva Sort</title>
</head>
<body>
  
  <table id="KivaSort" class="display compact">
    <thead>
        <tr>
          <th>Name</th>
          <th>Portfolio Yield</th>
          <th>Profitability</th>
          <th>Country</th>
          <th>Default Rate</th>
        </tr>
     </thead>
    <tbody></tbody>
</table>

 <script
			  src="//code.jquery.com/jquery-3.5.1.min.js"
			  integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0="
			  crossorigin="anonymous"></script>
  <script src="//cdn.datatables.net/1.10.10/js/jquery.dataTables.min.js"></script>
  <script src="//cristoper.github.io/jquery-KivaSort/kiva_sort.js"></script>
  
</body>
</html>

JavaScript

$(document).ready(function () {
   var table = $('#KivaSort');
   table.makeKivaTable({
     pageLength: 5,
     scrollX: true,
     /* Sort by Portfolio Yield, and then Profitability */
     order: [[1, "desc"], [2, "desc"]]
   });
   
   /* Filter out rows with no portfolio yield or profitability data */
   table.DataTable().columns('th').search('^(?!-$)', true, false);
   
   });