1<table id="data-table" class="table table-striped table-bordered" width="100%" cellspacing="0"> 2 <thead> 3 <tr> 4 <th class="nd_center-cell">Left Device</th> 5 <th class="nd_center-cell">Left Port</th> 6 <th class="nd_center-cell">Right Device</th> 7 <th class="nd_center-cell">Right Port</th> 8 <th class="nd_center-cell">Action</th> 9 </tr> 10 </thead> 11 <tbody> 12 <tr> 13 <td class="nd_center-cell"> 14 <div class="input-append"> 15 <input data-form="add" class="nd_topo_dev nd_topo_dev1" name="dev1" type="text" value="[% params.dev1 | html_entity %]"> 16 <span class="add-on nd_topo_dev_caret"><i class="icon-caret-down icon-large"></i></span> 17 </div> 18 </td> 19 <td class="nd_center-cell"> 20 <div class="input-append"> 21 <input data-form="add" class="nd_topo_port nd_topo_dev1" name="port1" type="text" value="[% params.port1 | html_entity %]"> 22 <span class="add-on nd_topo_port_caret"><i class="icon-caret-down icon-large"></i></span> 23 </div> 24 </td> 25 <td class="nd_center-cell"> 26 <div class="input-append"> 27 <input data-form="add" class="nd_topo_dev nd_topo_dev2" name="dev2" type="text"> 28 <span class="add-on nd_topo_dev_caret"><i class="icon-caret-down icon-large"></i></span> 29 </div> 30 </td> 31 <td class="nd_center-cell"> 32 <div class="input-append"> 33 <input data-form="add" class="nd_topo_port nd_topo_dev2" name="port2" type="text"> 34 <span class="add-on nd_topo_port_caret"><i class="icon-caret-down icon-large"></i></span> 35 </div> 36 </td> 37 <td class="nd_center-cell"> 38 <button class="btn btn-small nd_adminbutton" name="add" type="submit"><i class="icon-plus-sign"></i> Add</button> 39 </td> 40 </tr> 41 [% SET count = 0 %] 42 [% WHILE (row = results.next) %] 43 [% SET count = count + 1 %] 44 <tr> 45 <td class="nd_center-cell"><a class="nd_linkcell" href="[% uri_for('/device') | none %]?q=[% row.device1.ip | uri %]"> 46 [% (row.device1.dns || row.device1.name || row.device1.ip) | html_entity %]</a> 47 </td> 48 <td class="nd_center-cell">[% row.port1 | html_entity %]</td> 49 <td class="nd_center-cell"><a class="nd_linkcell" href="[% uri_for('/device') | none %]?q=[% row.device2.ip | uri %]"> 50 [% (row.device2.dns || row.device2.name || row.device2.ip) | html_entity %]</a></td> 51 <td class="nd_center-cell">[% row.port2 | html_entity %]</td> 52 <td class="nd_center-cell"> 53 <button class="btn" data-toggle="modal" 54 data-target="#nd_devdel-[% count | html_entity %]" type="button"><i class="icon-trash text-error"></i></button> 55 56 <div id="nd_devdel-[% count | html_entity %]" class="nd_modal nd_deep-horizon modal hide fade" tabindex="-1" 57 role="dialog" aria-labelledby="nd_devdel-label-[% count | html_entity %]" aria-hidden="true"> 58 <div class="modal-header"> 59 <button type="button" class="close" data-dismiss="modal" aria-hidden="true">x</button> 60 <h3 id="nd_devdel-label-[% count | html_entity %]">Are you sure?</h3> 61 </div> 62 <div class="modal-body"> 63 <blockquote> 64 <p class="text-info">The link between these two ports will be removed:</p> 65 <p> </p> 66 <ul> 67 <li><p class="text-info">[% (row.device1.dns || row.device1.name || row.device1.ip) | html_entity %], 68 [% row.port1 | html_entity %]</p></li> 69 <li><p class="text-info">[% (row.device2.dns || row.device2.name || row.device2.ip) | html_entity %], 70 [% row.port2 | html_entity %]</p></li> 71 </ul> 72 </blockquote> 73 <input data-form="del" name="dev1" type="hidden" value="[% row.dev1 | html_entity %]"> 74 <input data-form="del" name="port1" type="hidden" value="[% row.port1 | html_entity %]"> 75 <input data-form="del" name="dev2" type="hidden" value="[% row.dev2 | html_entity %]"> 76 <input data-form="del" name="port2" type="hidden" value="[% row.port2 | html_entity %]"> 77 </div> 78 <div class="modal-footer"> 79 <button class="btn btn-success" data-dismiss="modal" aria-hidden="true">Cancel</button> 80 <button class="btn btn-danger nd_adminbutton" name="del" data-dismiss="modal">Confirm</button> 81 </div> 82 </div> 83 </td> 84 </tr> 85 [% END %] 86 </tbody> 87</table> 88 89<script> 90$(document).ready(function() { 91 $('#data-table').dataTable({ 92 "columnDefs": [ { 93 "targets": [ 4 ], 94 "orderable": false, 95 "searchable": false 96 } ], 97[% INCLUDE 'ajax/datatabledefaults.tt' -%] 98 } ); 99} ); 100</script> 101 102