PDA

View Full Version : why it takes three clicks before it triggers ??



golmiami
06-03-2008, 06:01 AM
:confused: I have this script to sort the columns, works till the third click.. does any body have and idea why?


<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>

Nile
06-03-2008, 12:28 PM
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)