Go Premium for a chance to win a PS4. Enter to Win

x
?
Solved

Sorting  in Coldfusion

Posted on 2012-12-20
12
Medium Priority
?
176 Views
Last Modified: 2013-01-23
Hi,

How to sort multiple tables at the same time in  a cF page.

For example when the user sort first table then it has to automatically sort other tables  according to first one  in that page...
0
Comment
Question by:new_perl_user
12 Comments
 
LVL 19

Expert Comment

by:erikTsomik
ID: 38709801
Are you talking about html tables on the page
0
 

Author Comment

by:new_perl_user
ID: 38709832
Yes....
0
 
LVL 83

Expert Comment

by:leakim971
ID: 38710522
1 - create a sort function for each table
2 - each sort function use a key
3 - for the "other" table the key come from the first table
4 - for the first table the key is the order (desc or asc)
5 - each time you sort the first one, you call the sort function of the other table

function sort(table_to_sort, key) {
// sort code
}
0
Technology Partners: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 

Author Comment

by:new_perl_user
ID: 38710551
I am a newbie to CF, if possible can u pls give me a code snippet..


Right now we have a function called sort  and we are calling this sort function  at both the tables as below:

table1:

<th class=" headline" width="2%" nowrap="nowrap" sv="c"  onclick="sort(0,document.getElementById('b1').value);"

table2:
<th class=" headline" width="2%" nowrap="nowrap" sv="c"  onclick="sort(0,document.getElementById('b1').value);"
0
 
LVL 83

Expert Comment

by:leakim971
ID: 38710567
I know your code is secret defense but, please, post more.
0
 

Author Comment

by:new_perl_user
ID: 38710634
function for sorting is:

function sort (b_0,b_1)
            {       var current_col = this.document.getElementById("b0").value;
                  
                  if (b_0 != current_col) { b_1 = 0}
                  else {
                        if (b_1 == '0' ) { b_1 = '1'; }
                        else { b_1 = '0' ;}
                  }
                  var sortby = "'["+b_0+","+b_1+"]'";
                    
                  this.document.getElementById("b0").setAttribute("value", b_0);
                  this.document.getElementById("b1").setAttribute("value", b_1);
            }
            

And we are calling this function at both tables like below :

table1:

<table width="100%" cellpadding="0" id="bdhl" >

<th class=" headline" width="2%" nowrap="nowrap" vv="a"  onclick="sort(0,document.getElementById('b1').value);">ZIPCODE</th>

<th class=" headline" width="4%" nowrap="nowrap" vv="b"  onclick="sort(1,document.getElementById('b1').value)">ADDRESS</th>


table2:

<table width="100%" cellpadding="0" id="hefl" >

<th class=" headline" width="2%" nowrap="nowrap" vv="a"  onclick="sort(0,document.getElementById('b1').value);"> ZIPCODE</th>

<th class=" headline" width="4%" nowrap="nowrap" vv="b"  onclick="sort(1,document.getElementById('b1').value);">ADDRESS</th>


I am trying to get if user sort by table1 zipcode , sorting has to take place even for table2 zipcode ..
0
 
LVL 83

Accepted Solution

by:
leakim971 earned 2000 total points
ID: 38710654
Ok to call the onclick javascript of th, table2, you may use :

<table width="100%" cellpadding="0" id="bdhl" >

<th class=" headline" width="2%" nowrap="nowrap" vv="a"  onclick="sort(0,document.getElementById('b1').value);document.getElementById('hefl').getElementsByTagName('th')[0].click();">ZIPCODE</th>
0
 

Author Comment

by:new_perl_user
ID: 38710767
Thank you so much  it is working to some extent but..

When a user is sorting  table1 column1 ascending and when he is revisiting the page it is changing both the tables  to desc..


Any clue..
0
 
LVL 83

Expert Comment

by:leakim971
ID: 38710796
you're welcome.
Any clue..
no, sorry
0
 
LVL 16

Expert Comment

by:Gurpreet Singh Randhawa
ID: 38712812
you can use jquery tablesorter plugin, That will fix your issue, Just need to use the class and that's it, its done

http://tablesorter.com/docs/
0
 

Author Comment

by:new_perl_user
ID: 38713177
we have tried  tablesorter but it did not work for multi-table sorting...

Can you let me know how it works..
0
 

Author Comment

by:new_perl_user
ID: 38727336
Can anyone please help me on this...

When a user is sorting  table1 column1 ascending and when he is revisiting the page it is changing both the tables  to desc..

But for desc it is working fine...

Do I need to tweak anything here

function sort (b_0,b_1)
            {       var current_col = this.document.getElementById("b0").value;
                 
                  if (b_0 != current_col) { b_1 = 0}
                  else {
                        if (b_1 == '0' ) { b_1 = '1'; }
                        else { b_1 = '0' ;}
                  }
                  var sortby = "'["+b_0+","+b_1+"]'";
                   
                  this.document.getElementById("b0").setAttribute("value", b_0);
                  this.document.getElementById("b1").setAttribute("value", b_1);
            }
0

Featured Post

Free Tool: Port Scanner

Check which ports are open to the outside world. Helps make sure that your firewall rules are working as intended.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

This article discusses how to create an extensible mechanism for linked drop downs.
Today, the web development industry is booming, and many people consider it to be their vocation. The question you may be asking yourself is – how do I become a web developer?
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

824 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question