Solved

Sorting  in Coldfusion

Posted on 2012-12-20
12
167 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 82

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
 

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 82

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
3 Use Cases for Connected Systems

Our Dev teams are like yours. They’re continually cranking out code for new features/bugs fixes, testing, deploying, testing some more, responding to production monitoring events and more. It’s complex. So, we thought you’d like to see what’s working for us.

 
LVL 82

Accepted Solution

by:
leakim971 earned 500 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 82

Expert Comment

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

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

Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

Question has a verified solution.

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

International Data Corporation (IDC) prognosticates that before the current the year gets over disbursing on IT framework products to be sent in cloud environs will be $37.1B.
Boost your ability to deliver ambitious and competitive web apps by choosing the right JavaScript framework to best suit your project’s needs.
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…

920 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

Need Help in Real-Time?

Connect with top rated Experts

16 Experts available now in Live!

Get 1:1 Help Now