Question

I have long tables generated by datagrid control that go beyond the page width. I would like to convert that into separate table for each row or definition list where each field name is followed by field value.

How would I do that.

Answer 1

Uses jquery. If you have more than one table you’ll need to change it to accommodate that. Also, just appends to the end of the document. If you want it elsewhere, find the element you want to place it after and insert it into the DOM at that point.

$(document).ready(     function() {          var headers = $('tr:first').children();          $('tr:not(:first)').each(            function(i,row) {               var cols = jQuery(row).children();               var dl = jQuery('<dl></dl>');               for (var i=0, len = headers.length; i < len; ++i) {                  var dt = jQuery('<dt>');                  dt.text( jQuery(headers[i]).text() );                   var dd = jQuery('<dd>');                  dd.text( jQuery(cols[i]).text() );                   dl.append(dt).append(dd);              }              $('body').append(dl);           }         );         $('table').remove();     } );