By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
438,814 Members | 2,162 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 438,814 IT Pros & Developers. It's quick & easy.

cell merging script

ninerkz
P: 2
has anyone successfully written a cell merging script that will vertically merge cells with identical values?

I saw a post from a few weeks ago but I can't get in touch with the post writer (samn). I've tried to fill in the missing parts, but I can't seem to get his fragment of a script to work. Any help?

Thanks,
ninerkz
Sep 19 '06 #1
Share this Question
Share on Google+
1 Reply


ninerkz
P: 2
After literally months of trying to figure this one out (my javascript skills are at a beginner level), I have figured this one out. What I can't figure out is why no one has written or posted a script like this before.

here's the code:

Expand|Select|Wrap|Line Numbers
  1. function init() {
  2.     if (!document.getElementsByTagName || !document.getElementById) return;
  3.  
  4.     var x = document.getElementsByTagName('table')[0];
  5.     var xbody = document.getElementById('merge'); //tbody elem (so the thead doesn't get involved)
  6.     var ybody = document.createElement('tbody');
  7.  
  8. // manipulate the tbodies
  9.     var xrows = xbody.getElementsByTagName('tr');
  10.     var numXrows = xrows.length;
  11.  
  12.     var xcells = xbody.getElementsByTagName('td');
  13.     var xcols = xcells.length / xrows.length;
  14.  
  15.     var identical;
  16.     var mergeNum;
  17.  
  18.     for (var i = 0; i < xcols; i++) { // going across
  19.         mergeNum = 1;
  20.         for (var j = 0; j < numXrows; j++) { // going down
  21.             // for each row in the xbody, read the value of the cell
  22.             if (mergeNum <= 1) {
  23.                 var myRow = xbody.getElementsByTagName('tr')[j];
  24.                 var myCell= myRow.getElementsByTagName('td')[i];
  25.                 var myCellTxt = myCell.childNodes[0].data;
  26.             } else {
  27.                 // myRow should be the same as the previous iteration of the loop.
  28.             }
  29.  
  30.             // get the next row, same column
  31.             if (xbody.getElementsByTagName('tr')[j+1]) {
  32.                 var nxtRow = xbody.getElementsByTagName('tr')[j+1];
  33.                 var nxtCell = nxtRow.getElementsByTagName('td')[i];
  34.                 var nxtCellTxt = nxtCell.childNodes[0].data;
  35.             } else {
  36.                 // next row doesn't exist.
  37.             }
  38.  
  39.             // compare the current cell and the next cell
  40.             if (myCellTxt == nxtCellTxt) {
  41.                 identical = true;
  42.                 mergeNum += 1;
  43.                 nxtCell.style.display = 'none';
  44.                 myCell.rowSpan = mergeNum;
  45.             } else { // reset the mergeNum
  46.                 mergeNum = 1;
  47.             }
  48.  
  49.             // account for last row being completely hidden
  50.             if (myCell.style.display == 'none' && myCell.rowSpan) {
  51.                 myCell.style.display = '';
  52.             }
  53.         }
  54.     }
  55. }
  56.  
Feel free to use it.
~ninerkz
Sep 19 '06 #2

Post your reply

Sign in to post your reply or Sign up for a free account.