Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Register Log in
  • Congratulations Andrzejek on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Sorting Table Dynamically 1

Status
Not open for further replies.
moretips

moretips

MIS
Sep 25, 2000
25
US
I wish to sort a table dynamically using array.sort method. Below is my code, but it didn't work, can any one give help ???

--------------- Script ----------------------

<SCRIPT LANGUAGE=&quot;JavaScript&quot;><!--
function myObject(number,text,date,name) {
this.number = number;
this.text = text;
this.date = date;
this.name = name;
}

function setObject(number,text,date,name){
myObjectArray[objectArrayIndex++] = new myObject(number,text,date,name);

}

var objectArrayIndex = 0;
var myObjectArray = new Array();

setObject(100,'abc','1997/11/04','Me');
setObject(400,'zzz','1996/10/03','You');
setObject(300,'fox','1995/09/02','Them');
setObject(50,'bad','1998/12/01','Us');
setObject(110,'fbc','2000/11/04','We');

function Compare(a,b) {
for (var i in myObjectArray) {
return a[0]-b[0];
}
}


function showObjectArray(object,length) {
var output = '<CENTER><TABLE BORDER=1>';
output += '<TR>' +
'<TH><A HREF=&quot;test18.htm?number&quot;>number<\/A><\/TH>' +
'<TH><A HREF=&quot;test18.htm?text&quot;>text<\/A><\/TH>' +
'<TH><A HREF=&quot;test18.htm?date&quot;>date<\/A><\/TH>' +
'<TH><A HREF=&quot;test18.htm?name&quot;>name<\/A><\/TH>' +
'<\/TR>';
for (var i=0; i<length; i++)
output += '<TR>' +
'<TD>' + object.number+ '<\/TD>' +
'<TD>' + object.text + '<\/TD>' +
'<TD>' + object.date + '<\/TD>' +
'<TD>' + object.name + '<\/TD>' +
'<\/TR>';
output += '<\/TABLE><\/CENTER>';
document.write(output);
}


var sortProperty = window.location.search.substring(1);


if(sortProperty.length != 0)
myObjectArray.sort(Compare);

showObjectArray(myObjectArray,objectArrayIndex);

//--></SCRIPT>

------------- End Script --------------------
[sig][/sig]
 
Sort by date Sort by votes
Can any one help me !!!!!!!!!!!!!!!!!!!!! [sig][/sig]
 
Upvote 0 Downvote
Heres one that works - I've made some changes to your script and also added the function myArraySort (coloured red). This was found on (search for javascript sort):-

<HTML><HEAD>
<SCRIPT LANGUAGE=&quot;JavaScript&quot;>

<!--
function myObject(number,text,date,name)
{
this.number = number;
this.text = text;
this.date = date;
this.name = name;
}

function setObject(number,text,date,name)
{
myObjectArray[objectArrayIndex++] = new myObject (number,text,date,name);
}

var objectArrayIndex = 0;
var myObjectArray = new Array();

setObject(100,'abc','1997/11/04','Me');
setObject(400,'zzz','1996/10/03','You');
setObject(300,'fox','1995/09/02','Them');
setObject(50,'bad','1998/12/01','Us');
setObject(110,'fbc','2000/11/04','We');


function myArraySort() {
var changes=true;
for(;changes;) {
changes = false
for(var i=0;i<myObjectArray.length-1;++i) {
if (sortProperty == &quot;number&quot;) {
var v1 = myObjectArray.number;
if(isNaN(v1)) v1 = 0;
var v2 = myObjectArray[i+1].number;
if(isNaN(v2)) v2 = 0;
if(v1 > v2) {
changes = true
var temp = myObjectArray
myObjectArray = myObjectArray[i+1]
myObjectArray[i+1] = temp
}
}else if (sortProperty == &quot;text&quot;) {
var v1 = myObjectArray.text;
var v2 = myObjectArray[i+1].text;
if(v1 > v2) {
changes = true
var temp = myObjectArray
myObjectArray = myObjectArray[i+1]
myObjectArray[i+1] = temp
}
}else if (sortProperty == &quot;name&quot;) {
var v1 = myObjectArray.name;
var v2 = myObjectArray[i+1].name;
if(v1 > v2) {
changes = true
var temp = myObjectArray
myObjectArray = myObjectArray[i+1]
myObjectArray[i+1] = temp
}
}else if (sortProperty == &quot;date&quot;) {
var v1 = myObjectArray.date;
var v2 = myObjectArray[i+1].date;
if(v1 > v2) {
changes = true
var temp = myObjectArray
myObjectArray = myObjectArray[i+1]
myObjectArray[i+1] = temp
}
}
}
}
}


function showObjectArray(object,length)
{
var output = '<CENTER><TABLE BORDER=1>';
output += '<TR>' + '<TH><A HREF=&quot;sort.html?number&quot;>number<\/A><\/TH>' + '<TH><A HREF=&quot;sort.html?text&quot;>text<\/A><\/TH>' + '<TH><A HREF=&quot;sort.html?date&quot;>date<\/A><\/TH>' + '<TH><A HREF=&quot;sort.html?name&quot;>name<\/A><\/TH>' + '<\/TR>';
for (var i=0; i<length; i++)
{
output += '<TR>' + '<TD>' + object.number+ '<\/TD>' + '<TD>' + object.text + '<\/TD>' + '<TD>' + object.date + '<\/TD>' + '<TD>' + object.name + '<\/TD>' + '<\/TR>';
}
output += '<\/TABLE><\/CENTER>';
document.write(output);
}

var sortProperty = window.location.search.substring(1);

if (sortProperty.length != 0) myArraySort();

showObjectArray(myObjectArray,objectArrayIndex);

//-->
</SCRIPT>
</HEAD></HTML>

You will see that there are seperate sections within the sort function for the four sort columns/types. The last three all do a text sort - you will need to change the date sort if you intend to use real dates within your array.

Give it a go, and get SORTED :) [sig][/sig]
 
Upvote 0 Downvote
Thanks flatbloke !!! hmm...... but actually i need a Array.sort method instead of the bubble sort method.

I have to call the function Compare several times, but it seem like fail to do it. I dunno what's wrong with the script.

Can u pls show me. Thanks !!!!!!! [sig][/sig]
 
Upvote 0 Downvote
The problem with your script is that you are trying to sort an array of arrays. Within the sort function you need to tell the sort which property is being sorted on. Having thought about this I came up with the following (which I have tested in IE5 and NN4):-


function myCompare(a,b)
{
var prop1 = eval('a.' + sortProperty);
var prop2 = eval('b.' + sortProperty);
if (prop1 > prop2) return 1;
if (prop1 == prop2) return 0;
if (prop1 < prop2) return -1;
}

var sortProperty = window.location.search.substring(1);

if (sortProperty.length != 0) myObjectArray.sort(myCompare);


You can reverse the sort order by making the following changes:-

function myCompare(a,b)
{
var prop1 = eval('a.' + sortProperty);
var prop2 = eval('b.' + sortProperty);

if (prop1 > prop2) return -1;
if (prop1 == prop2) return 0;
if (prop1 < prop2) return 1;

}

Enjoy! :) [sig][/sig]
 
Upvote 0 Downvote
flatbloke , a million thanks for u !!!!!!!! It works !!!

hmm... i got some questions..

This array.sort method is much more simple than bubble sort method, but why a lot of tutorial or forum always use this method ???

What i know is the fastest sorting method is using either shell sort or quick sort, but y the bubble sort is so famous.

Thanks for answer !!!!!! :)

[sig][/sig]
 
Upvote 0 Downvote
Status
Not open for further replies.

Similar threads

lexer
  • Locked
  • Question
Passing fields from (html-JavaScript) table to JavaScript Function
Replies
0
Views
438
lexer
lexer
malpa
  • Locked
  • Question
Graph the selection of a html table row
Replies
0
Views
451
malpa
malpa
coldbohemia
  • Locked
  • Question
jquery function always returns contents of the same table cell, no matter which table cell i click
Replies
0
Views
405
coldbohemia
coldbohemia
AbidingDude
  • Locked
  • Question
Dynamically Create A Table
Replies
3
Views
143
AbidingDude
AbidingDude
lexer
  • Locked
  • Question
Adding datepicker calendar dynamically
Replies
0
Views
187
lexer
lexer

Part and Inventory Search

Sponsor

Back
Top