Solved

Sorting  in Coldfusion

Posted on 2012-12-20
12
173 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
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
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
Business Impact of IT Communications

What are the business impacts of how well businesses communicate during an IT incident? Targeting, speed, and transparency all matter. Find out more in this infographic.

 

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
 
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 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

Salesforce Made Easy to Use

On-screen guidance at the moment of need enables you & your employees to focus on the core, you can now boost your adoption rates swiftly and simply with one easy tool.

Question has a verified solution.

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

Hi, Even though I have created this Tutorial on My personal Blog, Some people might not able to find my website, So here i am posting it again Today, from the topic it is very clear that i will be showing you here the very basic usage of how we …
This article discusses how to implement server side field validation and display customized error messages to the client.
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…
Suggested Courses

752 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