mods/ldap/jscripts/jqgrid/js/grid.tbltogrid.js

   1 /*
   2  Transform a table to a jqGrid.
   3  Peter Romianowski <peter.romianowski@optivo.de>
   4  If the first column of the table contains checkboxes or
   5  radiobuttons then the jqGrid is made selectable.
   6 */
   7 // Addition - selector can be a class or id
   8 function tableToGrid(selector) {
   9 $(selector).each(function() {
  10         if(this.grid) {return;} //Adedd from Tony Tomov
  11         // This is a small "hack" to make the width of the jqGrid 100%
  12         $(this).width("99%");
  13         var w = $(this).width();
  14
  15         // Text whether we have single or multi select
  16         var inputCheckbox = $('input[type=checkbox]:first', $(this));
  17         var inputRadio = $('input[type=radio]:first', $(this));
  18         var selectMultiple = inputCheckbox.length > 0;
  19         var selectSingle = !selectMultiple && inputRadio.length > 0;
  20         var selectable = selectMultiple || selectSingle;
  21         var inputName = inputCheckbox.attr("name") || inputRadio.attr("name");
  22
  23         // Build up the columnModel and the data
  24         var colModel = [];
  25         var colNames = [];
  26         $('th', $(this)).each(function() {
  27                 if (colModel.length == 0 && selectable) {
  28                         colModel.push({
  29                                 name: '__selection__',
  30                                 index: '__selection__',
  31                                 width: 0,
  32                                 hidden: true
  33                         });
  34                         colNames.push('__selection__');
  35                 } else {
  36                         colModel.push({
  37                                 name: $(this).html(),
  38                                 index: $(this).html(),
  39                                 width: $(this).width() || 150
  40                         });
  41                         colNames.push($(this).html());
  42                 }
  43         });
  44         var data = [];
  45         var rowIds = [];
  46         var rowChecked = [];
  47         $('tbody > tr', $(this)).each(function() {
  48                 var row = {};
  49                 var rowPos = 0;
  50                 data.push(row);
  51                 $('td', $(this)).each(function() {
  52                         if (rowPos == 0 && selectable) {
  53                                 var input = $('input', $(this));
  54                                 var rowId = input.attr("value");
  55                                 rowIds.push(rowId || data.length);
  56                                 if (input.attr("checked")) {
  57                                         rowChecked.push(rowId);
  58                                 }
  59                                 row[colModel[rowPos].name] = input.attr("value");
  60                         } else {
  61                                 row[colModel[rowPos].name] = $(this).html();
  62                         }
  63                         rowPos++;
  64                 });
  65         });
  66
  67         // Clear the original HTML table
  68         $(this).empty();
  69
  70         // Mark it as jqGrid
  71         $(this).addClass("scroll");
  72
  73         $(this).jqGrid({
  74                 datatype: "local",
  75                 width: w,
  76                 colNames: colNames,
  77                 colModel: colModel,
  78                 multiselect: selectMultiple
  79                 //inputName: inputName,
  80                 //inputValueCol: imputName != null ? "__selection__" : null
  81         });
  82
  83         // Add data
  84         for (var a = 0; a < data.length; a++) {
  85                 var id = null;
  86                 if (rowIds.length > 0) {
  87                         id = rowIds[a];
  88                         if (id && id.replace) {
  89                                 // We have to do this since the value of a checkbox
  90                                 // or radio button can be anything
  91                                 id = encodeURIComponent(id).replace(/[.\-%]/g, "_");
  92                         }
  93                 }
  94                 if (id == null) {
  95                         id = a + 1;
  96                 }
  97                 $(this).addRowData(id, data[a]);
  98         }
  99
 100         // Set the selection
 101         for (var a = 0; a < rowChecked.length; a++) {
 102                 $(this).setSelection(rowChecked[a]);
 103         }
 104 });
 105 };