DataTables for device by location report

Netdisco/lib/App/Netdisco/Web/Plugin/Report/DeviceByLocation.pm

@@ -15,21 +15,24 @@ register_report(
 );
 
 get '/ajax/content/report/devicebylocation' => require_login sub {
-    my $set
+    my @results
         = schema('netdisco')->resultset('Device')
-        ->search( {},
-        { order_by => [qw/ location name ip vendor model /], } );
-    return unless $set->count;
+        ->columns(  [qw/ ip dns name location vendor model /] )
+        ->order_by( [qw/ location name ip vendor model /] )->hri->all;
+
+    return unless scalar @results;
 
     if ( request->is_ajax ) {
-        template 'ajax/report/devicebylocation.tt', { results => $set, },
+        my $results = to_json( \@results );
+        template 'ajax/report/devicebylocation.tt', { results => $results },
             { layout => undef };
     }
     else {
         header( 'Content-Type' => 'text/comma-separated-values' );
-        template 'ajax/report/devicebylocation_csv.tt', { results => $set, },
-            { layout => undef };
+        template 'ajax/report/devicebylocation_csv.tt',
+            { results => \@results },
+            { layout  => undef };
     }
 };
 
-true;
+1;

Netdisco/share/views/ajax/report/devicebylocation.tt

@@ -1,4 +1,4 @@
-<table class="table table-bordered table-condensed table-striped nd_floatinghead">
+<table id="data-table" class="table table-striped table-bordered nd_floatinghead" width="100%" cellspacing="0">
   <thead>
     <tr>
       <th class="nd_center-cell">Location</th>
@@ -8,32 +8,47 @@
       <th class="nd_center-cell">Model</th>
     </tr>
   </thead>
-  </tbody>
-  [% WHILE (row = results.next) %]
-  [% NEXT UNLESS row.vendor AND row.model %]
-  <tr>
-      <td>
-        [% IF row.location %]
-          <a href="[% search_device %]&q=[% row.location | uri %]&location=[% row.location | uri %]">
-            [% row.location | html_entity %]</a>
-        [% ELSE %]
-          [Not Set]
-        [% END %]
-      </td>
-      <td><a href="[% uri_for('/device') %]?q=[% row.ip | uri %]">[% row.dns || row.ip | html_entity %]</a></td>
-      <td><a href="[% search_device %]&q=[% row.name | uri %]&name=[% row.name | uri %]">
-            [% row.name | html_entity %]</a>
-      </td>
-      <td>
-        <a href="[% search_device %]&q=[% row.vendor | uri %]&vendor=[% row.vendor | uri %]">
-            [% row.vendor | html_entity %]</a>
-      </td>
-      <td>
-        <a href="[% search_device %]&q=[% row.model | uri %]&model=[% row.model | uri %]">
-            [% row.model | html_entity %]</a>
-      </td>
-  </tr>
-    [% END %]
-  </tbody>
 </table>
 
+<script type="text/javascript">
+$(document).ready(function() {
+    var table = $('#data-table').dataTable({
+        "deferRender": true,
+        "data": [% results %],
+        "columns": [
+           {
+                data: 'location',
+                render: function(data, type, row, meta) {
+                  if (data) {
+                    return '<a href="[% search_device %]&q=' + data + '&location=' + data + '">' + data + '</a>';
+
+                  } else {
+                    return '[Not Set]';
+                  }
+                }
+            }, {
+                data: 'ip',
+                render: function(data, type, row, meta) {
+                    return '<a href="[% uri_for('/device') %]?q=' + data + '">' + (row.dns || row.ip) + '</a>';
+                }
+            }, {
+                data: 'name',
+                render: function(data, type, row, meta) {
+                    return '<a href="[% search_device %]&q=' + data + '&model=' + data + '">' + data + '</a>';
+                }
+            }, {
+                data: 'vendor',
+                render: function(data, type, row, meta) {
+                    return '<a href="[% search_device %]&q=' + data + '&model=' + data + '">' + data + '</a>';
+                }
+            }, {
+                data: 'model',
+                render: function(data, type, row, meta) {
+                    return '<a href="[% search_device %]&q=' + data + '&model=' + data + '">' + data + '</a>';
+                }
+            }
+        ]
+    });
+
+});
+</script>

Netdisco/share/views/ajax/report/devicebylocation_csv.tt

@@ -1,7 +1,7 @@
 [% USE CSV -%]
 [% CSV.dump([ 'Location' 'Device' 'System Name' 'Vendor' 'Model' ]) %]
 
-[% WHILE (row = results.next) %]
+[% FOREACH row IN results %]
   [% mylist = [] %]
   [% device = row.dns || row.ip %]
   [% FOREACH col IN [ row.location device row.name row.vendor row.model ] %]