'Tis a sad, sad day...jQuery kills FireFox but works great in IE!

[Eric Cobb]

Oh, the horror to see my beloved FireFox crash repeatedly when trying to
run some jQuery that works flawlessly in IE 8!  (I thought it was
supposed to be the other way around!)

Seriously though, I do have a chunk of jQuery that I hope someone here
can help me with.  Basically, I have a (large) table that has a list of
users with IDs of "newUsers" and "oldUsers".  I have a checkbox that
displays/hides the "oldUsers".  In IE everything works instantaneously.
  But in FireFox when you first check the box it takes several seconds
to hide the "oldUsers".  Then, when you uncheck the box to display the
"oldUsers" again, it changes the display instantly but then the browser
hangs and crashes every time.

Now, as I mentioned before this table is large, with somewhere around
500 rows.  Is this too much for FF/jQuery to handle?  I thought about
breaking it up between 2 separate "newUsers" and "oldUsers" divs and
just toggle the display accordingly, but I'd rather do it in one table
if I could.

--------
Here's my jQuery:

$(document).ready(function() {
        //table striping
                                $('table.stripe>tbody>tr:even').addClass("lite");
                                $('table.stripe>tbody>tr:odd').addClass("dark");

        //Display/Hide new and old user tables rows.
        $("#userFilter").click(function(){
                // If checked
                if ($("#userFilter").is(":checked")){
                        //hide all old users            
                        $('table.stripe>tbody>tr:not(#newUsers)').hide();
                                }
                else {
                        //show all old users            
                        $('table.stripe>tbody>tr:not(#newUsers)').show();
                        }
                      });
                    });


--------
Here's my table:

<table cellpadding="1" cellspacing="1" class="stripe">
        <tbody>
                <tr id="oldUsers"> <td>Old Test User</td>
                        <td align="center">Stuff</td>
                        <td align="center">Stuff</td>
                        <td align="center">Stuff</td> </tr> <tr
id="oldUsers"> <td>Old Test User</td>
                        <td align="center">Stuff</td>
                        <td align="center">Stuff</td>
                        <td align="center">Stuff</td> </tr> <tr
id="newUsers"> <td>New Test User</td>
                        <td align="center">Stuff</td>
                        <td align="center">Stuff</td>
                        <td align="center">Stuff</td> </tr> <tr
id="oldUsers"> <td>New Test User</td>
                        <td align="center">Stuff</td>
                        <td align="center">Stuff</td>
                        <td align="center">Stuff</td> </tr>
        </tbody>
<!-- Rinse and repeat about 490 more times -->
</table>


Any ideas as to why this would be killing FireFox?  Is it just the way
FF handles processing the display/hide of so many table rows?


--

Thanks,

Eric Cobb
http://www.cfgears.com


~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~|
Want to reach the ColdFusion community with something they want? Let them know on the House of Fusion mailing lists
Archive: http://www.houseoffusion.com/groups/cf-talk/message.cfm/messageid:328327
Subscription: http://www.houseoffusion.com/groups/cf-talk/subscribe.cfm
Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=17837.14401.4

[Azadi Saryev]

your html is not valid: id's are supposed to be unique per page.
chnage that and you'll see ff work fine.

Azadi Saryev
Sabai-dee.com
http://www.sabai-dee.com/


On 13/11/2009 06:38, Eric Cobb wrote:

> Oh, the horror to see my beloved FireFox crash repeatedly when trying to
> run some jQuery that works flawlessly in IE 8!  (I thought it was
> supposed to be the other way around!)
>
> Seriously though, I do have a chunk of jQuery that I hope someone here
> can help me with.  Basically, I have a (large) table that has a list of
> users with IDs of "newUsers" and "oldUsers".  I have a checkbox that
> displays/hides the "oldUsers".  In IE everything works instantaneously.
>   But in FireFox when you first check the box it takes several seconds
> to hide the "oldUsers".  Then, when you uncheck the box to display the
> "oldUsers" again, it changes the display instantly but then the browser
> hangs and crashes every time.
>
> Now, as I mentioned before this table is large, with somewhere around
> 500 rows.  Is this too much for FF/jQuery to handle?  I thought about
> breaking it up between 2 separate "newUsers" and "oldUsers" divs and
> just toggle the display accordingly, but I'd rather do it in one table
> if I could.
>
> --------
> Here's my jQuery:
>
> $(document).ready(function() {
> //table striping
> $('table.stripe>tbody>tr:even').addClass("lite");
> $('table.stripe>tbody>tr:odd').addClass("dark");
>
> //Display/Hide new and old user tables rows.
> $("#userFilter").click(function(){
> // If checked
> if ($("#userFilter").is(":checked")){
> //hide all old users            
> $('table.stripe>tbody>tr:not(#newUsers)').hide();
>        }
> else {
> //show all old users            
> $('table.stripe>tbody>tr:not(#newUsers)').show();
>         }
>       });
>    });
>
>
> --------
> Here's my table:
>
> <table cellpadding="1" cellspacing="1" class="stripe">
> <tbody>
> <tr id="oldUsers"> <td>Old Test User</td>
> <td align="center">Stuff</td>
> <td align="center">Stuff</td>
> <td align="center">Stuff</td> </tr> <tr
> id="oldUsers"> <td>Old Test User</td>
> <td align="center">Stuff</td>
> <td align="center">Stuff</td>
> <td align="center">Stuff</td> </tr> <tr
> id="newUsers"> <td>New Test User</td>
> <td align="center">Stuff</td>
> <td align="center">Stuff</td>
> <td align="center">Stuff</td> </tr> <tr
> id="oldUsers"> <td>New Test User</td>
> <td align="center">Stuff</td>
> <td align="center">Stuff</td>
> <td align="center">Stuff</td> </tr>
> </tbody>
> <!-- Rinse and repeat about 490 more times -->
> </table>
>
>
> Any ideas as to why this would be killing FireFox?  Is it just the way
> FF handles processing the display/hide of so many table rows?
>
>
>  

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~|
Want to reach the ColdFusion community with something they want? Let them know on the House of Fusion mailing lists
Archive: http://www.houseoffusion.com/groups/cf-talk/message.cfm/messageid:328332
Subscription: http://www.houseoffusion.com/groups/cf-talk/subscribe.cfm
Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=17837.14401.4

[James Holmes-3]

Do you have firebug running at the same time? If so, try disabling it.

mxAjax / CFAjax docs and other useful articles:
http://www.bifrost.com.au/blog/



2009/11/13 Eric Cobb <cftalk@...>:

>
> Oh, the horror to see my beloved FireFox crash repeatedly when trying to
> run some jQuery that works flawlessly in IE 8!  (I thought it was
> supposed to be the other way around!)
>
> Seriously though, I do have a chunk of jQuery that I hope someone here
> can help me with.  Basically, I have a (large) table that has a list of
> users with IDs of "newUsers" and "oldUsers".  I have a checkbox that
> displays/hides the "oldUsers".  In IE everything works instantaneously.
>  But in FireFox when you first check the box it takes several seconds
> to hide the "oldUsers".  Then, when you uncheck the box to display the
> "oldUsers" again, it changes the display instantly but then the browser
> hangs and crashes every time.
>
> Now, as I mentioned before this table is large, with somewhere around
> 500 rows.  Is this too much for FF/jQuery to handle?  I thought about
> breaking it up between 2 separate "newUsers" and "oldUsers" divs and
> just toggle the display accordingly, but I'd rather do it in one table
> if

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~|
Want to reach the ColdFusion community with something they want? Let them know on the House of Fusion mailing lists
Archive: http://www.houseoffusion.com/groups/cf-talk/message.cfm/messageid:328335
Subscription: http://www.houseoffusion.com/groups/cf-talk/subscribe.cfm
Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=17837.14401.4

[Peter Boughton]

> I have a (large) table that has a list of
> users with IDs of "newUsers" and "oldUsers".

This is wrong!

Every ID on the page *must* be unique.

Use CLASS for common attributes.

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~|
Want to reach the ColdFusion community with something they want? Let them know on the House of Fusion mailing lists
Archive: http://www.houseoffusion.com/groups/cf-talk/message.cfm/messageid:328343
Subscription: http://www.houseoffusion.com/groups/cf-talk/subscribe.cfm
Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=17837.14401.4

[Eric Cobb]

Thank you Azadi!  I figured it was something simple like that.  I'll
give it a try and let you know how it goes.


Azadi Saryev wrote:

> your html is not valid: id's are supposed to be unique per page.
> chnage that and you'll see ff work fine.
>
> Azadi Saryev
> Sabai-dee.com
> http://www.sabai-dee.com/
>
>
> On 13/11/2009 06:38, Eric Cobb wrote:
>> Oh, the horror to see my beloved FireFox crash repeatedly when trying to
>> run some jQuery that works flawlessly in IE 8!  (I thought it was
>> supposed to be the other way around!)
>>
>> Seriously though, I do have a chunk of jQuery that I hope someone here
>> can help me with.  Basically, I have a (large) table that has a list of
>> users with IDs of "newUsers" and "oldUsers".  I have a checkbox that
>> displays/hides the "oldUsers".  In IE everything works instantaneously.
>>   But in FireFox when you first check the box it takes several seconds
>> to hide the "oldUsers".  Then, when you uncheck the box to display the
>> "oldUsers" again, it changes the display instantly but then the browser
>> hangs and crashes every time.
>>
>> Now, as I mentioned before this table is large, with somewhere around
>> 500 rows.  Is this too much for FF/jQuery to handle?  I thought about
>> breaking it up between 2 separate "newUsers" and "oldUsers" divs and
>> just toggle the display accordingly, but I'd rather do it in one table
>> if I could.
>>
>> --------
>> Here's my jQuery:
>>
>> $(document).ready(function() {
>> //table striping
>> $('table.stripe>tbody>tr:even').addClass("lite");
>> $('table.stripe>tbody>tr:odd').addClass("dark");
>>
>> //Display/Hide new and old user tables rows.
>> $("#userFilter").click(function(){
>> // If checked
>> if ($("#userFilter").is(":checked")){
>> //hide all old users            
>> $('table.stripe>tbody>tr:not(#newUsers)').hide();
>>        }
>> else {
>> //show all old users            
>> $('table.stripe>tbody>tr:not(#newUsers)').show();
>>         }
>>       });
>>    });
>>
>>
>> --------
>> Here's my table:
>>
>> <table cellpadding="1" cellspacing="1" class="stripe">
>> <tbody>
>> <tr id="oldUsers"> <td>Old Test User</td>
>> <td align="center">Stuff</td>
>> <td align="center">Stuff</td>
>> <td align="center">Stuff</td> </tr> <tr
>> id="oldUsers"> <td>Old Test User</td>
>> <td align="center">Stuff</td>
>> <td align="center">Stuff</td>
>> <td align="center">Stuff</td> </tr> <tr
>> id="newUsers"> <td>New Test User</td>
>> <td align="center">Stuff</td>
>> <td align="center">Stuff</td>
>> <td align="center">Stuff</td> </tr> <tr
>> id="oldUsers"> <td>New Test User</td>
>> <td align="center">Stuff</td>
>> <td align="center">Stuff</td>
>> <td align="center">Stuff</td> </tr>
>> </tbody>
>> <!-- Rinse and repeat about 490 more times -->
>> </table>
>>
>>
>> Any ideas as to why this would be killing FireFox?  Is it just the way
>> FF handles processing the display/hide of so many table rows?
>>
>>
>>  
>
>

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~|
Want to reach the ColdFusion community with something they want? Let them know on the House of Fusion mailing lists
Archive: http://www.houseoffusion.com/groups/cf-talk/message.cfm/messageid:328344
Subscription: http://www.houseoffusion.com/groups/cf-talk/subscribe.cfm
Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=17837.14401.4

[Eric Cobb]

Yeah, after tinkering with it a little more I realized what I was trying
to do would be better with classes instead of IDs.  I really didn't want
to have to deal with a unique ID for all 500 rows.

Anyway, here's my jQuery now:

$("#userFilter").click(function(){      
        // If checked
        if ($("#userFilter").is(":checked")){
                //hide all old users
                $(".oldUsers").css("display","none");
        }
        else {    
                 //show all old users
                $(".oldUsers").css("display","table-row");
        }
});

It works correctly in both FF and IE, although in FF there's still a
good bit of lag time from when you click the checkbox until it actually
hides the rows.  I guess it's just the way FF is dealing with so many
table rows.

--

Thanks,

Eric Cobb
http://www.cfgears.com



Peter Boughton wrote:

>> I have a (large) table that has a list of
>> users with IDs of "newUsers" and "oldUsers".
>>    
>
> This is wrong!
>
> Every ID on the page *must* be unique.
>
> Use CLASS for common attributes.
>
>

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~|
Want to reach the ColdFusion community with something they want? Let them know on the House of Fusion mailing lists
Archive: http://www.houseoffusion.com/groups/cf-talk/message.cfm/messageid:328345
Subscription: http://www.houseoffusion.com/groups/cf-talk/subscribe.cfm
Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=17837.14401.4

[Nicholas Stein]

Maybe I am missing something.  Why not just to it this way...
<cfset rNum = 0>
<cfoutput query="searchresults">
<cfset rNum = rNum + 1>
<tr<cfif rNum MOD 2 EQ 0> class="alternaterow"</cfif>>
...display <td></td>
</tr>
</cfoutput>

Nick

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~|
Want to reach the ColdFusion community with something they want? Let them know on the House of Fusion mailing lists
Archive: http://www.houseoffusion.com/groups/cf-talk/message.cfm/messageid:328351
Subscription: http://www.houseoffusion.com/groups/cf-talk/subscribe.cfm
Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=17837.14401.4

[Charlie Griefer]

Preference.

Some people would prefer to not introduce the extra CFML markup into the
HTML markup.

The jQuery lets you manipulate the HTML without actually modifying the
HTML.  That's nice.
The CF method will work even if the user has JS disabled.  That's nice.

Neither is "right" or "wrong".

On Fri, Nov 13, 2009 at 9:29 AM, Nicholas Stein <nicholasstein@...>wrote:

>
> Maybe I am missing something.  Why not just to it this way...
> <cfset rNum = 0>
> <cfoutput query="searchresults">
> <cfset rNum = rNum + 1>
> <tr<cfif rNum MOD 2 EQ 0> class="alternaterow"</cfif>>
> ...display <td></td>
> </tr>
> </cfoutput>
>
> Nick
>
>

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~|
Want to reach the ColdFusion community with something they want? Let them know on the House of Fusion mailing lists
Archive: http://www.houseoffusion.com/groups/cf-talk/message.cfm/messageid:328352
Subscription: http://www.houseoffusion.com/groups/cf-talk/subscribe.cfm
Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=17837.14401.4

[Josh Nathanson]

You might get a tad bit more speed if you do this in your selectors:

$("table.stripe>tbody>tr.oldUsers")

Instead of this:

$(".oldUsers")

This is because jQuery will execute the DOM search more specifically instead
of having to traverse the whole DOM for that class.

-- Josh



-----Original Message-----
From: Eric Cobb [mailto:cftalk@...]
Sent: Friday, November 13, 2009 6:26 AM
To: cf-talk
Subject: Re: 'Tis a sad, sad day...jQuery kills FireFox but works great in
IE!


Yeah, after tinkering with it a little more I realized what I was trying
to do would be better with classes instead of IDs.  I really didn't want
to have to deal with a unique ID for all 500 rows.

Anyway, here's my jQuery now:

$("#userFilter").click(function(){      
        // If checked
        if ($("#userFilter").is(":checked")){
                //hide all old users
                $(".oldUsers").css("display","none");
        }
        else {    
                 //show all old users
                $(".oldUsers").css("display","table-row");
        }
});

It works correctly in both FF and IE, although in FF there's still a
good bit of lag time from when you click the checkbox until it actually
hides the rows.  I guess it's just the way FF is dealing with so many
table rows.

--

Thanks,

Eric Cobb
http://www.cfgears.com



Peter Boughton wrote:

>> I have a (large) table that has a list of
>> users with IDs of "newUsers" and "oldUsers".
>>    
>
> This is wrong!
>
> Every ID on the page *must* be unique.
>
> Use CLASS for common attributes.
>
>

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~|
Want to reach the ColdFusion community with something they want? Let them know on the House of Fusion mailing lists
Archive: http://www.houseoffusion.com/groups/cf-talk/message.cfm/messageid:328355
Subscription: http://www.houseoffusion.com/groups/cf-talk/subscribe.cfm
Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=17837.14401.4

[Eric Cobb]

I'm not sure if you guys are following what I'm trying to do....

I want to dynamically hide/display certain table rows when a checkbox is
selected/deselected.

--

Thanks,

Eric Cobb
http://www.cfgears.com



Charlie Griefer wrote:

> Preference.
>
> Some people would prefer to not introduce the extra CFML markup into the
> HTML markup.
>
> The jQuery lets you manipulate the HTML without actually modifying the
> HTML.  That's nice.
> The CF method will work even if the user has JS disabled.  That's nice.
>
> Neither is "right" or "wrong".
>
> On Fri, Nov 13, 2009 at 9:29 AM, Nicholas Stein <nicholasstein@...>wrote:
>
>  
>> Maybe I am missing something.  Why not just to it this way...
>> <cfset rNum = 0>
>> <cfoutput query="searchresults">
>> <cfset rNum = rNum + 1>
>> <tr<cfif rNum MOD 2 EQ 0> class="alternaterow"</cfif>>
>> ...display <td></td>
>> </tr>
>> </cfoutput>
>>
>> Nick
>>
>>
>>    
>
>

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~|
Want to reach the ColdFusion community with something they want? Let them know on the House of Fusion mailing lists
Archive: http://www.houseoffusion.com/groups/cf-talk/message.cfm/messageid:328359
Subscription: http://www.houseoffusion.com/groups/cf-talk/subscribe.cfm
Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=17837.14401.4

[Eric Cobb]

Thanks Josh!  I'll give that a whirl and see how it works.

--

Thanks,

Eric Cobb
http://www.cfgears.com



Josh Nathanson wrote:

> You might get a tad bit more speed if you do this in your selectors:
>
> $("table.stripe>tbody>tr.oldUsers")
>
> Instead of this:
>
> $(".oldUsers")
>
> This is because jQuery will execute the DOM search more specifically instead
> of having to traverse the whole DOM for that class.
>
> -- Josh
>
>
>
> -----Original Message-----
> From: Eric Cobb [mailto:cftalk@...]
> Sent: Friday, November 13, 2009 6:26 AM
> To: cf-talk
> Subject: Re: 'Tis a sad, sad day...jQuery kills FireFox but works great in
> IE!
>
>
> Yeah, after tinkering with it a little more I realized what I was trying
> to do would be better with classes instead of IDs.  I really didn't want
> to have to deal with a unique ID for all 500 rows.
>
> Anyway, here's my jQuery now:
>
> $("#userFilter").click(function(){      
> // If checked
> if ($("#userFilter").is(":checked")){
> //hide all old users
> $(".oldUsers").css("display","none");
> }
> else {    
> //show all old users
> $(".oldUsers").css("display","table-row");
> }
> });
>
> It works correctly in both FF and IE, although in FF there's still a
> good bit of lag time from when you click the checkbox until it actually
> hides the rows.  I guess it's just the way FF is dealing with so many
> table rows.
>
>  

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~|
Want to reach the ColdFusion community with something they want? Let them know on the House of Fusion mailing lists
Archive: http://www.houseoffusion.com/groups/cf-talk/message.cfm/messageid:328360
Subscription: http://www.houseoffusion.com/groups/cf-talk/subscribe.cfm
Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=17837.14401.4

[Charlie Griefer]

On Fri, Nov 13, 2009 at 10:47 AM, Eric Cobb <cftalk@...> wrote:

>
> I'm not sure if you guys are following what I'm trying to do....
>
> I want to dynamically hide/display certain table rows when a checkbox is
> selected/deselected.
>

No, I was with ya.

I recognized that the question had to do with table striping in CF vs
jQuery, and wasn't really pertinent to the original question, but figured
I'd take a shot at answering :)

--
Charlie Griefer
http://charlie.griefer.com/

I have failed as much as I have succeeded. But I love my life. I love my
wife. And I wish you my kind of success.


~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~|
Want to reach the ColdFusion community with something they want? Let them know on the House of Fusion mailing lists
Archive: http://www.houseoffusion.com/groups/cf-talk/message.cfm/messageid:328361
Subscription: http://www.houseoffusion.com/groups/cf-talk/subscribe.cfm
Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=17837.14401.4

[lists-146]

Josh...

That's not true. Everything I've read says that the less specific you are,
the faster your code will run.

In your example, it has to search through a whole bunch of stuff rather than
just going and finding items with a class of oldUsers.



andy

-----Original Message-----
From: Josh Nathanson [mailto:pc@...]
Sent: Friday, November 13, 2009 12:20 PM
To: cf-talk
Subject: RE: 'Tis a sad, sad day...jQuery kills FireFox but works great in
IE!


You might get a tad bit more speed if you do this in your selectors:

$("table.stripe>tbody>tr.oldUsers")

Instead of this:

$(".oldUsers")

This is because jQuery will execute the DOM search more specifically instead
of having to traverse the whole DOM for that class.

-- Josh



-----Original Message-----
From: Eric Cobb [mailto:cftalk@...]
Sent: Friday, November 13, 2009 6:26 AM
To: cf-talk
Subject: Re: 'Tis a sad, sad day...jQuery kills FireFox but works great in
IE!


Yeah, after tinkering with it a little more I realized what I was trying
to do would be better with classes instead of IDs.  I really didn't want
to have to deal with a unique ID for all 500 rows.

Anyway, here's my jQuery now:

$("#userFilter").click(function(){      
        // If checked
        if ($("#userFilter").is(":checked")){
                //hide all old users
                $(".oldUsers").css("display","none");
        }
        else {    
                 //show all old users
                $(".oldUsers").css("display","table-row");
        }
});

It works correctly in both FF and IE, although in FF there's still a
good bit of lag time from when you click the checkbox until it actually
hides the rows.  I guess it's just the way FF is dealing with so many
table rows.

--

Thanks,

Eric Cobb
http://www.cfgears.com



Peter Boughton wrote:

>> I have a (large) table that has a list of
>> users with IDs of "newUsers" and "oldUsers".
>>    
>
> This is wrong!
>
> Every ID on the page *must* be unique.
>
> Use CLASS for common attributes.
>
>

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~|
Want to reach the ColdFusion community with something they want? Let them know on the House of Fusion mailing lists
Archive: http://www.houseoffusion.com/groups/cf-talk/message.cfm/messageid:328375
Subscription: http://www.houseoffusion.com/groups/cf-talk/subscribe.cfm
Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=17837.14401.4

[lists-146]

Eric. I've tried to do showing and hiding table rows with jQuery before and
it's not that great. It has to do with the way JavaScript considers TR tags
and all. Try taking a look at this example I wrote for Psychic Sales a long
time ago:

http://andymatthews.net/code/tablefilter/

-----Original Message-----
From: Eric Cobb [mailto:cftalk@...]
Sent: Friday, November 13, 2009 12:48 PM
To: cf-talk
Subject: Re: 'Tis a sad, sad day...jQuery kills FireFox but works great in
IE!


I'm not sure if you guys are following what I'm trying to do....

I want to dynamically hide/display certain table rows when a checkbox is
selected/deselected.

--

Thanks,

Eric Cobb
http://www.cfgears.com



Charlie Griefer wrote:

> Preference.
>
> Some people would prefer to not introduce the extra CFML markup into
> the HTML markup.
>
> The jQuery lets you manipulate the HTML without actually modifying the
> HTML.  That's nice.
> The CF method will work even if the user has JS disabled.  That's nice.
>
> Neither is "right" or "wrong".
>
> On Fri, Nov 13, 2009 at 9:29 AM, Nicholas Stein

<nicholasstein@...>wrote:

>
>  
>> Maybe I am missing something.  Why not just to it this way...
>> <cfset rNum = 0>
>> <cfoutput query="searchresults">
>> <cfset rNum = rNum + 1>
>> <tr<cfif rNum MOD 2 EQ 0> class="alternaterow"</cfif>> ...display
>> <td></td> </tr> </cfoutput>
>>
>> Nick
>>
>>
>>    
>
>

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~|
Want to reach the ColdFusion community with something they want? Let them know on the House of Fusion mailing lists
Archive: http://www.houseoffusion.com/groups/cf-talk/message.cfm/messageid:328376
Subscription: http://www.houseoffusion.com/groups/cf-talk/subscribe.cfm
Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=17837.14401.4

[Josh Nathanson]

Hmmm...ok, maybe I was thinking of the difference between ID and class or
something.  Sorry about that.

-- Josh


-----Original Message-----
From: Andy Matthews [mailto:lists@...]
Sent: Friday, November 13, 2009 12:52 PM
To: cf-talk
Subject: RE: 'Tis a sad, sad day...jQuery kills FireFox but works great in
IE!


Josh...

That's not true. Everything I've read says that the less specific you are,
the faster your code will run.

In your example, it has to search through a whole bunch of stuff rather than
just going and finding items with a class of oldUsers.



andy

-----Original Message-----
From: Josh Nathanson [mailto:pc@...]
Sent: Friday, November 13, 2009 12:20 PM
To: cf-talk
Subject: RE: 'Tis a sad, sad day...jQuery kills FireFox but works great in
IE!


You might get a tad bit more speed if you do this in your selectors:

$("table.stripe>tbody>tr.oldUsers")

Instead of this:

$(".oldUsers")

This is because jQuery will execute the DOM search more specifically instead
of having to traverse the whole DOM for that class.

-- Josh



-----Original Message-----
From: Eric Cobb [mailto:cftalk@...]
Sent: Friday, November 13, 2009 6:26 AM
To: cf-talk
Subject: Re: 'Tis a sad, sad day...jQuery kills FireFox but works great in
IE!


Yeah, after tinkering with it a little more I realized what I was trying
to do would be better with classes instead of IDs.  I really didn't want
to have to deal with a unique ID for all 500 rows.

Anyway, here's my jQuery now:

$("#userFilter").click(function(){      
        // If checked
        if ($("#userFilter").is(":checked")){
                //hide all old users
                $(".oldUsers").css("display","none");
        }
        else {    
                 //show all old users
                $(".oldUsers").css("display","table-row");
        }
});

It works correctly in both FF and IE, although in FF there's still a
good bit of lag time from when you click the checkbox until it actually
hides the rows.  I guess it's just the way FF is dealing with so many
table rows.

--

Thanks,

Eric Cobb
http://www.cfgears.com



Peter Boughton wrote:

>> I have a (large) table that has a list of
>> users with IDs of "newUsers" and "oldUsers".
>>    
>
> This is wrong!
>
> Every ID on the page *must* be unique.
>
> Use CLASS for common attributes.
>
>

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~|
Want to reach the ColdFusion community with something they want? Let them know on the House of Fusion mailing lists
Archive: http://www.houseoffusion.com/groups/cf-talk/message.cfm/messageid:328381
Subscription: http://www.houseoffusion.com/groups/cf-talk/subscribe.cfm
Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=17837.14401.4

[Azadi Saryev]

jquery 'best practice' in regard to class selectors is to prefix them
with tag name whenever possible.
i am not sure if using parent-child selectors speeds up the code
execution even more, but i imagine it could.

Azadi Saryev



On 14/11/2009 04:51, Andy Matthews wrote:

> Josh...
>
> That's not true. Everything I've read says that the less specific you are,
> the faster your code will run.
>
> In your example, it has to search through a whole bunch of stuff rather than
> just going and finding items with a class of oldUsers.
>
>
>
> andy
>
> -----Original Message-----
> From: Josh Nathanson [mailto:pc@...]
> Sent: Friday, November 13, 2009 12:20 PM
> To: cf-talk
> Subject: RE: 'Tis a sad, sad day...jQuery kills FireFox but works great in
> IE!
>
>
> You might get a tad bit more speed if you do this in your selectors:
>
> $("table.stripe>tbody>tr.oldUsers")
>
> Instead of this:
>
> $(".oldUsers")
>
> This is because jQuery will execute the DOM search more specifically instead
> of having to traverse the whole DOM for that class.
>
> -- Josh
>
>
>
> -----Original Message-----
> From: Eric Cobb [mailto:cftalk@...]
> Sent: Friday, November 13, 2009 6:26 AM
> To: cf-talk
> Subject: Re: 'Tis a sad, sad day...jQuery kills FireFox but works great in
> IE!
>
>
> Yeah, after tinkering with it a little more I realized what I was trying
> to do would be better with classes instead of IDs.  I really didn't want
> to have to deal with a unique ID for all 500 rows.
>
> Anyway, here's my jQuery now:
>
> $("#userFilter").click(function(){      
> // If checked
> if ($("#userFilter").is(":checked")){
> //hide all old users
> $(".oldUsers").css("display","none");
> }
> else {    
> //show all old users
> $(".oldUsers").css("display","table-row");
> }
> });
>
> It works correctly in both FF and IE, although in FF there's still a
> good bit of lag time from when you click the checkbox until it actually
> hides the rows.  I guess it's just the way FF is dealing with so many
> table rows.
>
>  

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~|
Want to reach the ColdFusion community with something they want? Let them know on the House of Fusion mailing lists
Archive: http://www.houseoffusion.com/groups/cf-talk/message.cfm/messageid:328390
Subscription: http://www.houseoffusion.com/groups/cf-talk/subscribe.cfm
Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=17837.14401.4