1<table id="data-table" class="table table-striped table-bordered" width="100%" cellspacing="0"> 2 <thead> 3 <tr> 4 <th>Left Device</th> 5 <th>Left Port</th> 6 <th>Left VLANs</th> 7 <th>Right Device</th> 8 <th>Right Port</th> 9 <th>Right VLANs</th> 10 </tr> 11 </thead> 12</table> 13 14<script type="text/javascript"> 15$(document).ready(function() { 16 var table = $('#data-table').dataTable({ 17 "deferRender": true, 18 "data": [% results | none %], 19 "columns": [ 20 { 21 "data": 'left_device', 22 "render": function(data, type, row, meta) { 23 return '<a href="[% device_ports | none %]&q=' + encodeURIComponent(data) + '">' + he.encode(data || '') + '</a>'; } 24 }, { 25 "data": 'left_port', 26 "type": 'portsort', 27 "render": function(data, type, row, meta) { 28 return type === 'display' ? 29 '<a href="[% device_ports | none %]&q=' + encodeURIComponent(row.left_device) + '&f=' + encodeURIComponent(data) + '">' + he.encode(data || '') + '</a>' : 30 he.encode(data || ''); } 31 }, { 32 "data": 'left_vlans' 33 }, { 34 "data": 'right_device', 35 "render": function(data, type, row, meta) { 36 return '<a href="[% device_ports | none %]&q=' + encodeURIComponent(data) + '">' + he.encode(data || '') + '</a>'; } 37 }, { 38 "data": 'right_port', 39 "type": 'portsort', 40 "render": function(data, type, row, meta) { 41 return type === 'display' ? 42 '<a href="[% device_ports | none %]&q=' + encodeURIComponent(row.right_device) + '&f=' + encodeURIComponent(data) + '">' + he.encode(data || '') + '</a>' : 43 he.encode(data || ''); } 44 }, { 45 "data": 'right_vlans' 46 } 47 ], 48[% INCLUDE 'ajax/datatabledefaults.tt' -%] 49 }); 50 51}); 52</script> 53