code to sort a table

xah

i'm just starting out on javascript.

can anyone show me how to go about writing a code to sort a table
column?

something like the following:

<table border="1">
<tr>
<td>
<a href="" onClick="">sort me</a>
</td>
<tr>
<tr>
<td>
2
</td>
<tr>
<tr>
<td>
3
</td>
<tr>
<tr>
<td>
1
</td>
<tr>
</table>

i'm guessing that the code would first read in the table entries as
documents.table.[1].??, assign it as a array, then sort, then delete
the table text, then print the table text.

How to delete the table text?

eventually this would be for a multi-column and multi-row table (a
matrix), and each row or column can be clicked to sort, without
disturbing existing order. The click would act as toggle or reverse
sorting.

Xah
xa*@xahlee.org
âˆ‘ http://xahlee.org/

Aug 27 '05 #1

Subscribe Post Reply

2330

Janwillem Borleffs

xa*@xahlee.org wrote:

i'm just starting out on javascript.

can anyone show me how to go about writing a code to sort a table
column?

That's the same as trying to ride the Tour de France the first time you are
learning to ride a bike.

Start reading the FAQ (http://jibbering.com/FAQ/) and try something simpler.
something like the following:

<table border="1">
<tr>
<td>
<a href="" onClick="">sort me</a>
</td>
<tr>
<tr>
Perhaps you should start to learn some basic HTML too; the above snippet is
not valid HTML because of the non-closed <tr>.
i'm guessing that the code would first read in the table entries as
documents.table.[1].??, assign it as a array, then sort, then delete
the table text, then print the table text.

How to delete the table text?

Just to give you an idea what's involved, here is an example of how you
could do it:

<script type="text/javascript">
function sortTable() {
var tds = document.getElementsByTagName('TD');
var content = [], val;
for (var i = 1; i < tds.length; i++) {
if (val = tds[i].innerHTML.replace('/[^\d]+/g','')) {
content[i - 1] = val;
}
}

content.sort();
for (var i = 1; i < tds.length; i++) {
tds[i].innerHTML = content[i - 1];
}
}
</script>
</head>

<body>
<table border="1">
<tr>
<td>
<a href="#" onClick="sortTable(); return false">sort me</a>
[...]
eventually this would be for a multi-column and multi-row table (a
matrix), and each row or column can be clicked to sort, without
disturbing existing order. The click would act as toggle or reverse
sorting.

As said before, learn the language first.
JW

Aug 27 '05 #2

Jim Davis

<xa*@xahlee.org> wrote in message
news:11*********************@g49g2000cwa.googlegro ups.com...
i'm just starting out on javascript.

can anyone show me how to go about writing a code to sort a table
column?

I assume you don't really mean to "sort the column" but rather to sort ON
the table column, right? In other words when somebody clicks your control
all the rows should move as single units rather than JUST the column data,
right?

If so then don't both sorting the column - it's messy and annoying to work
with the DOM to fetch values and such.

Instead create a sortable data structure representing your table - probably
an array of objects. A single function would display the table from this
structure. Your control would perform the sort on the structure, then call
the "display" function.

I've an abstraction object that could help here (long URL):

http://www.depressedpress.com/depres...ered/Index.cfm

It abstracts the processing of an array of objects allowing you to create
them, add and delete from them, sort them, shuffle the contents, etc.

There's an example at the bottom of that page that shows you how to create
and sort a table in this way. You may be able to modifiy to your needs
easily enough.

Hope this helps,

Jim Davis

Aug 27 '05 #3

ASM

xa*@xahlee.org wrote:

i'm just starting out on javascript.

sorting a table is not possible if you are starting ...

http://www.kryogenix.org/code/browser/sorttable/
http://www.mattkruse.com/javascript/...ble/index.html
--
Stephane Moriaux et son [moins] vieux Mac

Aug 28 '05 #4

Jim Davis

"ASM" <st*********************@wanadoo.fr.invalid> wrote in message
news:43**********************@news.wanadoo.fr...

xa*@xahlee.org wrote:
i'm just starting out on javascript.
sorting a table is not possible if you are starting ...

Well... perhaps a better way to say it is that if you end up being able to
sort a table then you're not starting out anymore. ;^)
http://www.kryogenix.org/code/browser/sorttable/
http://www.mattkruse.com/javascript/...ble/index.html

For what it's worth both of those example seem a lot more complex than they
need to be for the task - although they both, of course, worth just fine.
Regardless of how complex they are however they both provide decent
abstractions of that complexity so are useful to beginners.

Personally I don't see the utility of using the HTML of the table as the
data storage mechanism. I think thats what makes so many of these solutions
as complex as they are. Managing and sorting the data seprately from the
presentation is so very much simpler.

Jim Davis

Aug 28 '05 #5

ASM

Jim Davis wrote:

"ASM" <st*********************@wanadoo.fr.invalid> wrote in message
news:43**********************@news.wanadoo.fr...
xa*@xahlee.org wrote:
i'm just starting out on javascript.
sorting a table is not possible if you are starting ...

Well... perhaps a better way to say it is that if you end up being able to
sort a table then you're not starting out anymore. ;^)

:-)

http://www.kryogenix.org/code/browser/sorttable/
http://www.mattkruse.com/javascript/...ble/index.html

For what it's worth both of those example seem a lot more complex than they
need to be for the task - although they both, of course, worth just fine.
Regardless of how complex they are however they both provide decent
abstractions of that complexity so are useful to beginners.

Personally I don't see the utility of using the HTML of the table as the
data storage mechanism.

Question was : how to sort a table
on my idea the table is pre-existing
and to sort only on TD.innerHTML or TH is it less complex ?

Of course if you display a JS matrix in a table via document.write() or
else this way, it is a little simplier :
http://perso.wanadoo.fr/stephane.mor...ri_matrice.htm

I think thats what makes so many of these solutions as complex as they are. Managing and sorting the data seprately from the
presentation is so very much simpler.

I continue to think that function to sort a matrix is not easy to understand
could be seen here:
<http://groups.google.com/group/fr.comp.lang.javascript/msg/1ca86e2439894ee6?rnum=1>
--
Stephane Moriaux et son [moins] vieux Mac

Aug 28 '05 #6

Similar topics

somewhat painful join code

by: jason | last post by:

Hello. Newbie on SQL and suffering through this. I have two tables created as such: drop table table1; go drop table table2; go

Microsoft SQL Server

Dataview will not sort

by: Raymond Lewallen | last post by:

I have a dataview in which the sort property will not sort the dataview. Here's is a simple scenario similar to what I am doing: Class Foo Private Function Retrieve() As DataView ' Returns a...

.NET Framework

generic code to sort tables ?

by: Mel | last post by:

i need to sort my table based on a "header click". is there a generic code out there that does that for me, or i have to write one for each and every table i come up with ? many thanks for...

Javascript

Is it possible to sort a collection of XML childNodes?

by: bissatch | last post by:

Hi, I am about to create a table, where the values are taken from an XML file, where each column header you can click and it will sort the table rows at the client side. I have got to the...

Javascript

DataGrid control events like Sort, page, Item not getting fired...

by: Gunjan Garg | last post by:

Hello All, I am working to create a generic datagrid which accepts a datasource(ListData - This is our own datatype) and depending on the calling program customizes itself for sorting,...

ASP.NET

is there a way to speed up this tablesort code?

by: loc2006 | last post by:

I got this tablesort code from http://www.brainjar.com/dhtml/tablesort/default7.asp This is very slow for my table of 10 columns and 400 rows. Is there a way to optimize this code make it...

Javascript

How do I convert old onclick() code to DOM if a PHP variable is involved?

by: donpro | last post by:

Hi, I've created a table where the header columns link to an AJAX function which calls a PHP file and returns content - the purpose is to sort the table on the heading. The code snippet is:...

Javascript

I cannot understand why php flags up certain code that used elsewhere is fine

by: Hazza | last post by:

Hi, I am using PHP and mysql to create a website. I am fairly new to PHP, and thus am grateful to anyone who helps! Firstly I am running a homepage, that displays additional content if a user...

PHP

Is there an easy way to sort a list by two criteria?

by: neocortex | last post by:

Hello! I am a newbie in Python. Recently, I get stuck with the problem of sorting by two criteria. In brief, I have a two-dimensional list (for a table or a matrix). Now, I need to sort by two...

Python

How to turn on java script in a villaon keypad mobile phone

by: Charles Arthur | last post by:

How do i turn on java script on a villaon, callus and itel keypad mobile phone

Java

Merging data from multiple Excel files

by: ryjfgjl | last post by:

In our work, we often receive Excel tables with data in the same format. If we want to analyze these data, it can be difficult to analyze them because the data is spread across multiple Excel files...

Data Management

Navigating the Data Structures and Algorithms (DSA)

by: BarryA | last post by:

What are the essential steps and strategies outlined in the Data Structures and Algorithms (DSA) roadmap for aspiring data scientists? How can individuals effectively utilize this roadmap to progress...

Algorithms / Advanced Math

Is that possible of reading the .csv file in column wise and the column have different lengths ?

by: Sonnysonu | last post by:

This is the data of csv file 1 2 3 1 2 3 1 2 3 1 2 3 2 3 2 3 3 the lengths should be different i have to store the data by column-wise with in the specific length. suppose the i have to...

C / C++

How to build RAID in BIOS?

by: Hystou | last post by:

There are some requirements for setting up RAID: 1. The motherboard and BIOS support RAID configuration. 2. The motherboard has 2 or more available SATA protocol SSD/HDD slots (including MSATA, M.2...

Computer Hardware

Changing the language in Windows 10

by: Hystou | last post by:

Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can...

Windows Server

Problem With Comparison Operator <=> in G++

by: Oralloy | last post by:

Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers,...

C / C++

Discussion: How does Zigbee compare with other wireless protocols in smart home applications?

by: tracyyun | last post by:

Dear forum friends, With the development of smart home technology, a variety of wireless communication protocols have appeared on the market, such as Zigbee, Z-Wave, Wi-Fi, Bluetooth, etc. Each...

General

AI Job Threat for Devs

by: agi2029 | last post by:

Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing,...

Career Advice