Hi,I am doing project in ASP.NET(by VB.NEt).I have created an HTML Table.Now I want to apply sorting to the table in javascript.How can I do this?Any help will be appreciated.Thanking you!
4 2169
This question would be much better answered in the javascript forum, since it no longer has anything to do with .NET
I will move it for you.
MODERATOR
I don't know how much help you need.
This example allows you to sort a table by clicking in the selected column's header cell. You can also use tab and space (or enter) in IE and Firefox, but more code is needed to make it accessible by keyboard in Opera. - <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
-
<html lang= "en">
-
<head>
-
<meta http-equiv= "Content-Type" content="text/html; charset=utf-8">
-
<title>HTML Table Sort </title>
-
<!-- testing code; in use make the script and stylesheet remote files
-
-
-->
-
<script type= "text/javascript" >
-
function sortColumn(e){
-
/* the handler calls a sorting function on the targeted cells
-
*/
-
var who= window.event ? event.srcElement : e.target;
-
var pa= who.parentNode;
-
var T= pa,txt;
-
while(T.nodeName != 'TABLE') T= T.parentNode;
-
var C= T.getElementsByTagName('caption')[0];
-
if(C)txt= who.title.replace('Sort','Sorted');
-
T= T.getElementsByTagName('tbody')[0];
-
var A= pa.getElementsByTagName("th");
-
var L= A.length, count= 0;
-
while (A[count] != who) ++count;
-
do_colSort(count,T);
-
if(txt)C.firstChild.nodeValue= txt;
-
}
-
-
function do_colSort(count,T){
-
/* the sorting method (alphabetical or by price)
-
is determined by the contents of the first td in the column
-
You could use class namesto filter the sort in a more complex table
-
*/
-
var R= T.getElementsByTagName("tr");
-
var L= R.length,RA= [], A= [], tem, funS;
-
for (var i= 0; i < L; i++){
-
RA[i]= R[i];
-
tem= R[i].getElementsByTagName("td")[count];
-
A[i]= [i,tem.firstChild.nodeValue];
-
}
-
if(/\$/.test(A[0][1])){
-
funS= function(a, b){
-
a= parseFloat(a[1].replace(/\D+/g, ""));
-
b= parseFloat(b[1].replace(/\D+/g, ""));
-
return a - b;
-
}
-
}
-
else{
-
funS= function(a, b){
-
a= a[1].toLowerCase();
-
b= b[1].toLowerCase();
-
if (a== b) return 0;
-
if (a > b) return 1;
-
return -1;
-
}
-
}
-
A.sort(funS);
-
for (var i= 0; i < L; i++){
-
tem= A[i][0];
-
T.appendChild(RA[tem]);
-
}
-
}
-
-
onload= function(){
-
/* assign event handlers to the thead cells,
-
if it has a class name including 'sortable'
-
*/
-
if(document.createTextNode){
-
var t= document.getElementsByTagName('thead')[0];
-
if(t.className.indexOf('sortable')==-1) return;
-
t= t.getElementsByTagName('th');
-
var L= t.length,who;
-
for(var i= 0;i<L;i++){
-
who= t[i];
-
if(who.className && /nosort/i.test(who.className)) continue;
-
who.onclick= sortColumn;
-
who.onmouseover= who.onfocus= function(e){
-
e= window.event?event.srcElement:e.target;
-
e.style.color= 'red'
-
};
-
who.onmouseout= who.onblur= function(e){
-
e= window.event?event.srcElement:e.target;
-
e.style.color= ''
-
};
-
who.title= 'Sort by '+who.firstChild.nodeValue;
-
who.tabIndex= 1;
-
who.onkeypress= who.onclick;
-
}
-
var C= document.getElementsByTagName('caption')[0];
-
if(C)C.firstChild.nodeValue= 'Sort by column';
-
}
-
}
-
-
</script>
-
<style type= "text/css">
-
body{font-size:120%;margin:1ex 1em;color:black;background:white;font-family:"Times New Roman", serif}
-
table{border:ridge black 3px;background-color:white;font-size:1.1em;width:50%}
-
td,th{border:solid black 1px;padding:2px;width:33%}
-
.sortableClass th{cursor:pointer}
-
thead,tfoot{background-color:#eee;font-size:1.1em;font-weight:bold;text-align:center}
-
caption{font-weight:bold}
-
</style>
-
</head>
-
<body>
-
<h1 id= "firstH1" style="margin-top:2em">HTML Elements</h1>
-
<h2>Sorting Table Elements</h2>
-
<div>
-
<table>
-
<caption>Three Column Table</caption>
-
<thead class= "sortableClass">
-
<tr>
-
<th>Make</th>
-
<th>Model</th>
-
<th>Price</th>
-
</tr>
-
</thead>
-
<tbody>
-
<tr>
-
<td>Ford</td><td>Truck</td><td>$23,000</td>
-
</tr>
-
<tr>
-
<td>Subaru</td><td>Wagon</td><td>$21,000</td>
-
</tr>
-
<tr>
-
<td>Kia</td><td>Compact</td><td>$13,000</td>
-
</tr>
-
<tr>
-
<td>Lexus</td><td>Sedan</td><td>$35,000</td>
-
</tr>
-
<tr>
-
<td>Honda</td><td>SUV</td><td>$26,000</td>
-
</tr>
-
</tbody>
-
</table>
-
</div>
-
</body>
-
</html>
Hi,I am doing project in ASP.NET(by VB.NEt).I have created an HTML Table.Now I want to apply sorting to the table in javascript.How can I do this?Any help will be appreciated.Thanking you!
Your thread had already been moved to the JavaScript forum and answered. I've merged the threads.
Moderator.
Sign in to post your reply or Sign up for a free account.
Similar topics
by: Tim |
last post by:
I've been working on this for over a week now, and just can't get this
figured out. Hoping one of you gurus can help me out here.
I have an xml data island that I'm representing on an htm page as...
|
by: John Bullock |
last post by:
Hello,
I am at wit's end with an array sorting problem. I have a
simple table-sorting function which must, at times, sort on columns that
include entries with nothing but a space (@nbsp;). I...
|
by: Gareth Gale |
last post by:
I'm trying to implement a way of allowing a user to sort a HTML table
via Javascript on the client. I've seen lots of samples where single
column sorting (asc or desc) is shown, but I'd like nested...
|
by: mike |
last post by:
If I had a date in the format "01-Jan-05" it does not sort properly
with my sort routine:
function compareDate(a,b)
{
var date_a = new Date(a);
var date_b = new Date(b);
if (date_a < date_b)...
|
by: jab3 |
last post by:
Hello -
I'm trying to implement a table that will allow the user to sort on
each column, like many applicaitons that have tabular data (e-mail,
song list, etc). It invovles grabbing the table,...
|
by: jmdolinger |
last post by:
Hi all,
I'm a newbie to Atlas (and recently ASP.NET) after coming from a long
Java background, also have done quite a bit with an Ajax.NET/ASP.NET
1.1 project, but it was basically all...
|
by: bcochofel |
last post by:
I'm using xsl to list an xml file that contains something like: sites,
tag and weight.
I'm listing this in a table with the following titles: | URL | TAG |
WEIGHT (each title his a link)
What...
|
by: Kamal |
last post by:
Hello all,
I have a very simple html table with collapsible rows and sorting
capabilities. The collapsible row is hidden with css rule
(display:none). When one clicks in the left of the...
|
by: dorandoran |
last post by:
The sort on the childgrid is not working; nothing happens when I click on the each column header for sort. (I followed Satay's sample: http://www.codeproject.com/KB/aspnet/EditNestedGridView.aspx)...
|
by: jrod11 |
last post by:
hi,
I found a jquery html table sorting code i have implemented. I am trying to figure out how to edit how many colums there are, but every time i remove code that I think controls how many colums...
|
by: DolphinDB |
last post by:
Tired of spending countless mintues downsampling your data? Look no further!
In this article, you’ll learn how to efficiently downsample 6.48 billion high-frequency records to 61 million...
|
by: ryjfgjl |
last post by:
ExcelToDatabase: batch import excel into database automatically...
|
by: isladogs |
last post by:
The next Access Europe meeting will be on Wednesday 6 Mar 2024 starting at 18:00 UK time (6PM UTC) and finishing at about 19:15 (7.15PM).
In this month's session, we are pleased to welcome back...
|
by: Vimpel783 |
last post by:
Hello!
Guys, I found this code on the Internet, but I need to modify it a little. It works well, the problem is this: Data is sent from only one cell, in this case B5, but it is necessary that data...
|
by: jfyes |
last post by:
As a hardware engineer, after seeing that CEIWEI recently released a new tool for Modbus RTU Over TCP/UDP filtering and monitoring, I actively went to its official website to take a look. It turned...
|
by: ArrayDB |
last post by:
The error message I've encountered is; ERROR:root:Error generating model response: exception: access violation writing 0x0000000000005140, which seems to be indicative of an access violation...
|
by: PapaRatzi |
last post by:
Hello,
I am teaching myself MS Access forms design and Visual Basic. I've created a table to capture a list of Top 30 singles and forms to capture new entries. The final step is a form (unbound)...
|
by: Shællîpôpï 09 |
last post by:
If u are using a keypad phone, how do u turn on JavaScript, to access features like WhatsApp, Facebook, Instagram....
|
by: af34tf |
last post by:
Hi Guys, I have a domain whose name is BytesLimited.com, and I want to sell it. Does anyone know about platforms that allow me to list my domain in auction for free. Thank you
| |