1<table id="data-table" class="table table-striped table-bordered" width="100%" cellspacing="0">
2  <thead>
3    <tr>
4      <th>VLAN ID</th>
5      <th>VLAN Name</th>
6      <th>Device Count</th>
7      <th>Port Count</th>
8    </tr>
9  </thead>
10</table>
11
12<script type="text/javascript">
13$(document).ready(function() {
14  var table = $('#data-table').dataTable({
15    "deferRender": true,
16    "data": [% results | none %],
17    "columns": [
18      {
19        "data": 'vlan',
20        "render": function(data, type, row, meta) {
21          return '<a href="[% uri_for('/search') | none %]?tab=vlan&q=' + encodeURIComponent(data) + '">' + data + '</a>';
22        }
23      }, {
24        "data": 'description',
25        "render": function(data, type, row, meta) {
26          return '<a href="[% uri_for('/search') | none %]?tab=vlan&q=' + encodeURIComponent(data) + '">' + he.encode(data || '') + '</a>';
27        }
28      }, {
29        "data": 'dcount',
30        "searchable": false,
31        "render": function(data, type, row, meta) {
32          return data.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
33        }
34      }, {
35        "data": 'pcount',
36        "searchable": false,
37        "render": function(data, type, row, meta) {
38          return data.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
39        }
40      }
41    ],
42[% INCLUDE 'ajax/datatabledefaults.tt' -%]
43  });
44});
45</script>
46