PDA

Click to See Complete Forum and Search --> : Help to sort a table

ramien
04-21-2004, 09:32 PM
I need help on sorting a table using Javascript/DHTML.

I have a CGI script which pulls from a flatfile and pushes to a CGI which builds an html file that populates a table. Instead of using the CGI to sort and have to run this on the server I want to create a simple Javascript that I can use to sort the table.

I have seen javascripts which call from an external sorttable.js and they work fine on my windows box, but when I run it from my unix server it doesnt work. Also sometimes on the windows box the sort just ascends/descends and doesnt really sort.

I just need help with a javascript that uses the Table TH fields and allows you to click on them to sort by alphabetical order. The values in the table will be <INPUT> tags and not plan text, so it is somewhat different.

Can someone point me in the right direction?
Kor
04-22-2004, 03:46 AM
I myself working (but other urgent projects soped me for a while) for this kind of stuff... It is not ready but I might give you some clues

Thre are 2 javascript functions witch will automatically sort alphabetically the elements in an array and reverse that sort,

sort()
reverse()

var bla=new Array()
bla[0]='k';
bla[1]='2';
bla[2]='a';

bla.sort() will do the sorting
bla.reverse() will simply reverse the order. If sorted first, will perform a reversed sorting.

Now try building your inputs as array elements, sort /reverse them and repopulate the table (DHTML or DOM, at will)
Kor
04-22-2004, 04:12 AM
Here's a basic example:


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<script>
function set(){
val = new Array()
for(i=0;i<document.getElementsByTagName('input').length;i++){
val[i]= document.getElementsByTagName('input')[i].value;
}
}
function arrangeVal(){
for(i=0;i<document.getElementsByTagName('input').length;i++){
document.getElementsByTagName('input')[i].value =val[i]
}
}
function sortVal(){
val.sort();
arrangeVal();
}
function reverseVal(){
val.reverse();
arrangeVal();
}
window.onload=set
</script>
</head>

<body>
<a href="#" onclick="sortVal()">sort</a><br>
<a href="#" onclick="reverseVal()">reverse</a><br>
<br>
<table width="150" border="0" cellpadding="0" cellspacing="0" bgcolor="#CCCCCC">
<tr>
<td><input type="text" value="k text">
<br></td>
</tr>
<tr>
<td><input type="text" value="1 text"><br></td>
</tr>
<tr>
<td><input type="text" value="a text"><br></td>
</tr>
</table>

</body>
</html>
ramien
05-01-2004, 05:39 PM
KOR while i see how this works, it doesnt help me any do to the fact that your script requires a value given to each field prior to the page displaying to the user.

I think i can modify this though to get what I need.
Kor
05-02-2004, 01:45 AM
requires a value given to each


oh, but it does not... I give them values just for an quick testing... The values can be input by the user as well
ramien
05-02-2004, 12:14 PM
I tried it and it does work without the value in the HTML.
Kor
05-03-2004, 02:33 AM
Modify like this:

function sortVal(){
set();
val.sort();
arrangeVal();
}
function reverseVal(){
set();
val.reverse();
arrangeVal();
}

and use
value=""
if you want to have a blank initial value