1<table id="data-table" class="table table-striped table-bordered" width="100%" cellspacing="0">
2  <thead>
3    <tr>
4      <th>Device</th>
5      <th class="nd_center-cell">Total Ports</th>
6      <th class="nd_center-cell">In Use</th>
7      <th class="nd_center-cell">Shutdown</th>
8      <th class="nd_center-cell">Free</th>
9    </tr>
10  </thead>
11</table>
12
13<script type="text/javascript">
14$(document).ready(function() {
15    var table = $('#data-table').dataTable({
16        "deferRender": true,
17        "data": [% results | none %],
18        "columns": [
19           {
20                "data": 'ip',
21                "render": function(data, type, row, meta) {
22                    return '<a href="[% device_ports | none %]&q=' + encodeURIComponent(data) + '">' + he.encode(row.dns || row.ip) + '</a>';
23                }
24            }, {
25                "data": 'port_count',
26                "searchable": false,
27                "render": function(data, type, row, meta) {
28                    return data.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
29                }
30            }, {
31                "data": 'ports_in_use',
32                "searchable": false,
33                "render": function(data, type, row, meta) {
34                    return data.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
35                }
36            }, {
37                "data": 'ports_shutdown',
38                "searchable": false,
39                "render": function(data, type, row, meta) {
40                    return data.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
41                }
42            }, {
43                "data": 'ports_free',
44                "searchable": false,
45                "render": function(data, type, row, meta) {
46                    return data.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
47                }
48            }
49        ],
50[% INCLUDE 'ajax/datatabledefaults.tt' -%]
51    });
52
53});
54</script>
55