...

View Full Version : sorting columns?



sushestvo
10-18-2005, 06:20 PM
Is there a way to sort columns? Not rows. (it's not regular sort we see everyday)
In regular sort we have top row clickable - and it sorts rows under it.
Well I want to be able to click on first column items and it would sort columns to the right.
Example(bold is clickable and not moveable, everything else gets sorted)
Item School Price Balbla
A 800 90 5
B 3 2 1
C 10 500 50
When I would click ON B, I would get:
Item Balbla Price School
A 5 90 800
B 1 2 3
C 50 500 10
i know it's possible... i saw it somewhere once... but can't find it again.
Any help plz? :(

vwphillips
10-18-2005, 09:23 PM
I've done alph and numeric, will do date later



<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>
<title></title>
</head>

<body onload="zxcSortTableInit('SortTable1');">
http://www.codingforums.com/showthread.php?t=70486<br>
A 800 90 5<br>
B 3 2 1<br>
C 10 500 50<br>
When I would click ON B, I would get:<br>
A 5 90 800<br>
B 1 2 3<br>
C 50 500 10<br>

<table border="1">
<tbody id="SortTable1" >
<tr>
<td colspan="4" >Item School Price Balbla</td>
</tr>
<tr>
<td width="50" >A</td>
<td width="50" >800</td>
<td width="50" >90</td>
<td width="50" >5</td>
</tr>
<tr>
<td>B</td>
<td>3</td>
<td>2</td>
<td>1</td>
</tr>
<tr>
<td>C</td>
<td>10</td>
<td>500</td>
<td>50</td>
</tr>
<tr>
<td>D</td>
<td>Tom</td>
<td>Dick</td>
<td>Harry</td>
</tr>
</tbody>
</table>

<script language="JavaScript" type="text/javascript">
<!--
// by Vic Phillips http://www.vicsjavascripts.org.uk

function zxcSortTableInit(zxct){
zxct=document.getElementById(zxct);
zxctrs=zxct.getElementsByTagName('TR');
zxct.ary=new Array();
for (zxc0=1;zxc0<zxctrs.length;zxc0++){
zxct.ary[zxc0-1]=new Array();
zxctds=zxctrs[zxc0].getElementsByTagName('TD');
zxctds[0].onclick=function(){ zxcSortRow(this); }
zxctds[0].nu=zxc0-1;
zxctds[0].pobj=zxct;
for (zxc1=1;zxc1<zxctds.length;zxc1++){
zxct.ary[zxc0-1][zxc1-1]=[zxc1,zxctds[zxc1],zxctrs[zxc0],zxctds[zxc1].firstChild.data.replace(/\s/g,'')];
}
}
}

function zxcSortRow(zxcobj){
zxcary=zxcobj.pobj.ary;
if (isNaN(zxcary[zxcobj.nu][0][3])){
zxcary[zxcobj.nu]=zxcary[zxcobj.nu].sort(tsoSortAlpha);
}
else {
zxcary[zxcobj.nu]=zxcary[zxcobj.nu].sort(tsoSortNumeric);
}
for (zxc0=0;zxc0<zxcary.length;zxc0++){
for (zxc1=0;zxc1<zxcary[zxc0].length;zxc1++){
zxcary[zxc0][zxc1][2].removeChild(zxcary[zxc0][zxc1][1]);
}
}
for (zxc2=0;zxc2<zxcary[zxcobj.nu].length;zxc2++){
zxcary[zxcobj.nu][zxc2][2].appendChild(zxcary[zxcobj.nu][zxc2][1]);
for (zxc3=0;zxc3<zxcary.length;zxc3++){
if (zxc3!=zxcobj.nu){
for (zxc4=0;zxc4<zxcary[zxc3].length;zxc4++){
if (zxcary[zxc3][zxc4][0]==zxcary[zxcobj.nu][zxc2][0]){
zxcary[zxc3][zxc4][2].appendChild(zxcary[zxc3][zxc4][1]);
}
}
}
}
}
}

function tsoSortAlpha(tso0,tso1){
tsoA=tso0[3].toLowerCase();
tsoB=tso1[3].toLowerCase();
if (tsoA<tsoB){ return -1; }
if (tsoA>tsoB){ return 1; }
return 0;
}

function tsoSortNumeric(tso0,tso1){
tsoA=Number(tso0[3]);
tsoB=Number(tso1[3]);
return tsoA-tsoB;
}



//-->
</script>


</body>

</html>



edit - should work for any number of tables on the page, not tested

vwphillips
10-18-2005, 09:53 PM
now with date, start/finish rows and multi applications



<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>
<title></title>
</head>

<body onload="zxcSortTableInit('SortTable1',1,5);zxcSortTableInit('SortTable2',0,3);">
http://www.codingforums.com/showthread.php?t=70486<br>
A 800 90 5<br>
B 3 2 1<br>
C 10 500 50<br>
When I would click ON B, I would get:<br>
A 5 90 800<br>
B 1 2 3<br>
C 50 500 10<br>

<table border="1">
<tbody id="SortTable1" >
<tr>
<td colspan="4" >Item School Price Balbla</td>
</tr>
<tr>
<td width="80" >A</td>
<td width="80" >800</td>
<td width="80" >90</td>
<td width="80" >5</td>
</tr>
<tr>
<td>B</td>
<td>3</td>
<td>2</td>
<td>1</td>
</tr>
<tr>
<td>C</td>
<td>10</td>
<td>500</td>
<td>50</td>
</tr>
<tr>
<td>D</td>
<td>Tom</td>
<td>Dick</td>
<td>Harry</td>
</tr>
<tr>
<td>E</td>
<td>10/06/2005</td>
<td>06/10/2005</td>
<td>10/07/2004</td>
</tr>
</tbody>
</table>
<br>
<table border="1">
<tbody id="SortTable2" >
<tr>
<td width="80" >A</td>
<td width="80" >800</td>
<td width="80" >90</td>
<td width="80" >5</td>
</tr>
<tr>
<td>B</td>
<td>3</td>
<td>2</td>
<td>1</td>
</tr>
<tr>
<td>C</td>
<td>10</td>
<td>500</td>
<td>50</td>
</tr>
<tr>
<td>D</td>
<td>Tom</td>
<td>Dick</td>
<td>Harry</td>
</tr>
<tr>
<td>No Sort</td>
<td>10/06/2005</td>
<td>06/10/2005</td>
<td>10/07/2004</td>
</tr>
</tbody>
</table>

<script language="JavaScript" type="text/javascript">
<!--
// by Vic Phillips http://www.vicsjavascripts.org.uk

var zxcDateFormat='dd/mm/yyyy' ; // 'dd/mm/yyyy' or 'mm/dd/yyyy'

function zxcSortTableInit(zxct,zxcs,zxcf){
zxct=document.getElementById(zxct);
zxctrs=zxct.getElementsByTagName('TR');
zxct.ary=new Array();
for (zxc0=zxcs;zxc0<zxcf+1;zxc0++){
zxct.ary[zxc0-zxcs]=new Array();
zxctds=zxctrs[zxc0].getElementsByTagName('TD');
zxctds[0].onclick=function(){ zxcSortRow(this); }
zxctds[0].nu=zxc0-zxcs;
zxctds[0].pobj=zxct;
for (zxc1=1;zxc1<zxctds.length;zxc1++){
zxct.ary[zxc0-zxcs][zxc1-1]=[zxc1,zxctds[zxc1],zxctrs[zxc0],zxctds[zxc1].firstChild.data.replace(/\s/g,'')];
if (zxct.ary[zxc0-zxcs][zxc1-1][3].match('/')){
zxct.ary[zxc0-zxcs][zxc1-1][3]=zxcDate(zxct.ary[zxc0-1][zxc1-1][3]);
}
}
}
}

function zxcSortRow(zxcobj){
zxcary=zxcobj.pobj.ary;
if (isNaN(zxcary[zxcobj.nu][0][3])){
zxcary[zxcobj.nu]=zxcary[zxcobj.nu].sort(tsoSortAlpha);
}
else {
zxcary[zxcobj.nu]=zxcary[zxcobj.nu].sort(tsoSortNumeric);
}
for (zxc0=0;zxc0<zxcary.length;zxc0++){
for (zxc1=0;zxc1<zxcary[zxc0].length;zxc1++){
zxcary[zxc0][zxc1][2].removeChild(zxcary[zxc0][zxc1][1]);
}
}
for (zxc2=0;zxc2<zxcary[zxcobj.nu].length;zxc2++){
zxcary[zxcobj.nu][zxc2][2].appendChild(zxcary[zxcobj.nu][zxc2][1]);
for (zxc3=0;zxc3<zxcary.length;zxc3++){
if (zxc3!=zxcobj.nu){
for (zxc4=0;zxc4<zxcary[zxc3].length;zxc4++){
if (zxcary[zxc3][zxc4][0]==zxcary[zxcobj.nu][zxc2][0]){
zxcary[zxc3][zxc4][2].appendChild(zxcary[zxc3][zxc4][1]);
}
}
}
}
}
}

function tsoSortAlpha(tso0,tso1){
tsoA=tso0[3].toLowerCase();
tsoB=tso1[3].toLowerCase();
if (tsoA<tsoB){ return -1; }
if (tsoA>tsoB){ return 1; }
return 0;
}

function tsoSortNumeric(tso0,tso1){
tsoA=Number(tso0[3]);
tsoB=Number(tso1[3]);
return tsoA-tsoB;
}

function zxcDate(zxcd){
if (zxcDateFormat=='dd/mm/yyyy'){
return zxcd.split('/')[2]+zxcd.split('/')[1]+zxcd.split('/')[0];
}
return zxcd.split('/')[2]+zxcd.split('/')[0]+zxcd.split('/')[1];
}



//-->
</script>


</body>

</html>



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum