CSS Codes
CSS Layouts
Results 1 to 2 of 2

Thread: why it takes three clicks before it triggers ??

  1. 06-03-2008, 06:01 AM #1
    golmiami
    golmiami is offline Junior Coders
    Join Date
    May 2008
    Posts
    10
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Post why it takes three clicks before it triggers ??

    I have this script to sort the columns, works till the third click.. does any body have and idea why?

    Code:
    <html>
<head>
    
<script type="text/javascript">
<!--
if(document.getElementById)
window.onload=function(){
var buts = ['but1', 'but2', 'but3'],
  findTr = function(el){
    while (el.parentNode){
    el = el.parentNode;
    if (el.tagName.toLowerCase() == 'tr')
      return el;
    }
  return false;
};
   for (var i = buts.length - 1; i > -1; --i)
	document.getElementById(buts[i]).onclick = function(){
	var check = this.form.elements;
	for(var i = check.length - 1; i > -1 ; --i)
	if(check[i].type && check[i].type == 'checkbox' && !check[i].checked && findTr(check[i]))
		findTr(check[i]).style.display = 'none';
	};
};
// -->
</script>


<script type="text/javascript">
    
    var compfunc = new Array();

compfunc['alpha'] = function(a, b) {
	if (a > b) return 1;
	if (a < b) return -1;
	return 0;
}

compfunc['numeric'] = function(a, b) {
	return parseFloat(a) - parseFloat(b);
}

compfunc['date'] = function(a, b) {
	return new Date(Date.parse(a)).getTime() - new Date(Date.parse(b)).getTime();
}

function prepColumns(thead) {
	th = thead.getElementsByTagName('TH');
	for (var i = 0; i < th.length; i++)
		th[i].setAttribute('num', i);
}

function firstRealChild(parent) {
	var child = parent.firstChild;
	while (child && child.nodeType != 1) child = child.nextSibling;
	return child;
}

function nextRealSibling(el) {
	do el = el.nextSibling
	while (el && el.nodeType != 1);
	return el;
}

function assignTRValues(tbody, colnum) {
	var tr = firstRealChild(tbody);
	while (tr) {
		var td = firstRealChild(tr);
		var value;
		for(var i = 0; i < colnum; i++)
			td = nextRealSibling(td);
		tr.value = td.firstChild.data;
		tr = nextRealSibling(tr);
	}
}

function assignTROddEven(tbody) {
	var tr = firstRealChild(tbody);
	var odd = false;
	while (tr) {
		tr.className = odd ? '' : 'odd';
		odd = !odd;
		tr = nextRealSibling(tr);
	}
}

function sortTable(th) {
	var desc = th.desc;
	th.desc = !th.desc;
	
	//GET RID OF THIS LINE IF YOU EVER PLAN ON USING IT!!!
	/*th.title = (th.desc) ? 'sorted ASC, \nclick to sort DESC' : 'sorted DESC, \nclick to sort ASC';*/
	
	var table = th.parentNode.parentNode.parentNode;
	var thead = table.getElementsByTagName('THEAD')[0];
	var tbody = table.getElementsByTagName('TBODY')[0];

	// determine which column number they clicked by looking at the num attribute.  
	// If it's not set, go ahead and set it.
	colnum = th.getAttribute('num');
	if (!colnum) {
		prepColumns(thead);
		colnum = th.getAttribute('num');
	}
        
	var mode = table.getElementsByTagName('COL')[colnum].className;
	assignTRValues(tbody, colnum);
	sortChildren(tbody, 'value', mode, desc);
	assignTROddEven(tbody);
}

function sortChildren(parentElement, sortProperty, mode, desc){
	var children = [];
	var el = firstRealChild(parentElement);
	if (el) {
		var i = 0;
    
		while (el) {
			children[i] = new String(el[sortProperty]);
			children[i++].object = el;
			el = nextRealSibling(el);
		}
    
		children.sort(compfunc[mode]);
		if (desc) children.reverse();
		for(i = 0; i < children.length; i++)
			parentElement.appendChild(children[i].object);
	}
}
    
    
    </script>

<link href="SpryAssets/SpryTabbedPanels.css" rel="stylesheet" type="text/css" />
<style type="text/css">
<!--
.narrow {width:108px;
}
-->
</style>
<style type="text/css">
<!--
.asd {
	border-bottom-width: thin;
	border-bottom-style: solid;
	border-bottom-color: #FFFFFF;
	line-height: 14px;
}
.dew {
}
-->
</style>
</head>
<body>
<div id="TabbedPanels1" class="TabbedPanels">
  <div class="TabbedPanelsContentGroup">
        <form style="margin-top:0; margin-bottom:0;" action="#"><div class="TabbedPanelsContent">
         
         
            <table width="846" border="0" cellpadding="0" cellspacing="0" id="data">

  		<col class="alpha" /><col /><col class="alpha" /><col /><col class="alpha" /><col /><col class="alpha" /><col /><col class="alpha" /><col /><col class="alpha" />
      <thead>
      <tr style="cursor: hand; cursor: pointer;">
        <th width="170" onclick="sortTable(this);"><span class="texttop"> Name</span></th>
        <th width="1" bgcolor="#FFFFFF" ></th>
        <th width="120" onclick="sortTable(this);"><span class="texttop">col1</span></th>
        <th width="1" bgcolor="#FFFFFF" ></th>
        <th width="120" onclick="sortTable(this);"><span class="texttop">col2</span></th>
        <th width="1" bgcolor="#FFFFFF" ></th>
        <th width="120" onclick="sortTable(this);"><span class="texttop">col3</span></th>

        <th width="1" bgcolor="#FFFFFF" class="asd" ></th>
        <th width="120" onclick="sortTable(this);"><span class="texttop">col4</span></th>
        <th width="1" bgcolor="#FFFFFF" class="asd" ></th>
        <th width="190" onclick="sortTable(this);"><span class="texttop">col5</span></th>
        <th width="1" bgcolor="#FFFFFF" class="asd" onclick="sortTable(this);"></th>
        </tr>
      <tr style="cursor: hand; cursor: pointer;">
        <th width="170" height="1" bgcolor="#FFFFFF" onclick="sortTable(this);"></th>
        <th width="1" height="1" bgcolor="#FFFFFF" ></th>
        <th width="120" height="1" bgcolor="#FFFFFF" onclick="sortTable(this);"></th>
        <th width="1" height="1" bgcolor="#FFFFFF" ></th>
        <th width="120" height="1" bgcolor="#FFFFFF" onclick="sortTable(this);"></th>
        <th width="1" height="1" bgcolor="#FFFFFF" ></th>
        <th width="120" height="1" bgcolor="#FFFFFF" onclick="sortTable(this);"></th>
        <th width="1" height="1" bgcolor="#FFFFFF" class="asd" ></th>
        <th width="120" height="1" bgcolor="#FFFFFF" onclick="sortTable(this);"></th>
        <th width="1" height="1" bgcolor="#FFFFFF" class="asd" ></th>
        <th width="190" height="1" bgcolor="#FFFFFF" onclick="sortTable(this);"></th>
        <th width="1" bgcolor="#FFFFFF" class="asd" onclick="sortTable(this);"></th>
        </tr>
      </thead>
      <tbody>
      <tr>
        <td width="170" class="asd"><span class="texttop">value1<br />
1</span></td>
        <td width="1" bgcolor="#FFFFFF" class="asd"></td>
        <td width="120" align="center" bgcolor="#F9F9F9" class="asd"><span class="texttop">ZERO</span></td>
        <td width="1" bgcolor="#FFFFFF" class="asd"></td>
        <td width="120" align="center" bgcolor="#F9F9F9" class="asd"><span class="texttop">0.5%</span></td>

        <td width="1" bgcolor="#FFFFFF" class="asd"></td>
        <td width="120" align="center" bgcolor="#F9F9F9" class="asd"><span class="texttop">0.5%</span></td>
        <td width="1" bgcolor="#FFFFFF" class="asd"></td>
        <td width="120" align="center" bgcolor="#F9F9F9" class="asd"><span class="texttop">8.23%</span></td>
        <td width="1" bgcolor="#FFFFFF" class="asd"></td>
        <td width="190" align="left" class="asd"><span class="texttop"> book. It has survived not only five</span></td>
        <td width="1" bgcolor="#FFFFFF" class="asd"></td>
        </tr>
 <tr>
        <td width="170" class="asd"><span class="texttop">value2<br />
2</span></td>
        <td width="1" bgcolor="#FFFFFF" class="asd"></td>
        <td width="120" align="center" bgcolor="#F9F9F9" class="asd"><span class="texttop">1.0%</span></td>
        <td width="1" bgcolor="#FFFFFF" class="asd"></td>
        <td width="120" align="center" bgcolor="#F9F9F9" class="asd"><span class="texttop">1.0%</span></td>
        <td width="1" bgcolor="#FFFFFF" class="asd"></td>
        <td width="120" align="center" bgcolor="#F9F9F9" class="asd"><span class="texttop">NA</span></td>

        <td width="1" bgcolor="#FFFFFF" class="asd"></td>
        <td width="120" align="center" bgcolor="#F9F9F9" class="asd"><span class="texttop">7.89%</span></td>
        <td width="1" bgcolor="#FFFFFF" class="asd"></td>
        <td width="190" align="left" class="asd"><span class="texttop">book. It has survived not only five</span></td>
        <td width="1" bgcolor="#FFFFFF" class="asd"></td>
        </tr>
      <tr>
        <td width="170" class="asd"><span class="texttop">value3<br />
3</span></td>
        <td width="1" bgcolor="#FFFFFF"></td>
        <td width="120" align="center" bgcolor="#F9F9F9" class="asd"><span class="texttop">1.0%</span></td>
        <td width="1" bgcolor="#FFFFFF"></td>
        <td width="120" align="center" bgcolor="#F9F9F9" class="asd"><span class="texttop">ZERO</span></td>
        <td width="1" bgcolor="#FFFFFF"></td>
        <td width="120" align="center" bgcolor="#F9F9F9" class="asd"><span class="texttop">N/A</span></td>
        <td width="1" bgcolor="#FFFFFF" class="asd"></td>
        <td width="120" align="center" bgcolor="#F9F9F9" class="asd"><span class="texttop">8.02%</span></td>
        <td width="1" bgcolor="#FFFFFF" class="asd"></td>
        <td width="190" class="asd"><span class="texttop">book. It has survived not only </span></td>
        <td width="1" bgcolor="#FFFFFF" class="asd"></td>
        </tr>
      </tbody>
    </table>
        </div></form>
        
       
      </div>
</div>    
 
<script type="text/javascript">
<!--
var TabbedPanels1 = new Spry.Widget.TabbedPanels("TabbedPanels1");
//-->
    </script>
</body>
</html>
    Reply With Quote Reply With Quote
  2. 06-03-2008, 12:28 PM #2
    Nile's Avatar
    Nile
    Nile is offline Elite Coders
    Join Date
    Jan 2008
    Posts
    4,168
    Thanks
    28
    Thanked 628 Times in 624 Posts
    Blog Entries
    1

    Default

    I've had this problem too. Its because in the math, your subtracting more than you need to. So your subtracting 2 more than you need to from me just looking at it. See if you can find that mistake anywhere.(I didn't though)
    Jeremy | jfein.net
    Reply With Quote Reply With Quote
« Previous Thread | Next Thread »

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  

Forum Rules