Skip to main content

Bug Tracker

Side navigation

#12639 closed feature (wontfix)

Opened October 02, 2012 08:54PM UTC

Closed October 29, 2012 05:38PM UTC

Make toggleClass('active', function() { return bool; }) work

Reported by: Owned by:
Priority: low Milestone: None
Component: attributes Version: 1.8.0
Keywords: 1.9-discuss Cc:
Blocked by: Blocking:

toggleClass('active', bool) already works, setting or removing the "active" class dependent on the value of the passed boolean.

Please allow the boolean to be a boolean-returning function, deferring the decision to code. Thanks!

Attachments (0)
Change History (11)

Changed October 02, 2012 09:10PM UTC by rwaldron comment:1

owner: →
status: newpending

No use case? Well then... what's the use?

Changed October 02, 2012 10:03PM UTC by comment:2

status: pendingnew

Principle of least surprise and largest utility. Being able to write this:

$buttons = $('ul.buttons li a');
$ {
  var clicked = this;
  $buttons.toggleClass('active', function() { return this === clicked });

instead of (as you currently need to) this:

$buttons = $('ul.buttons li a');
$ {
  var clicked = this;
  $buttons.each(function() {
    $(this).toggleClass('active', this === clicked);

What is particularly unfortunate about the current behaviour is that first code example doesn't throw any error - it just behaves as if the function passed wasn't even there, plain toggling the class for all elements in the jQuery selection.

Changed October 02, 2012 10:26PM UTC by scottgonzalez comment:3

That use case is usually handled with something along the lines of:

$buttons.not( this ).removeClass( "active" );
$( this ).addClass( "active" );

Changed October 02, 2012 11:26PM UTC by comment:4

To me the point of using toggleClass in the first place is to write DRY code.

Anyway, I am not here to argue or press my point – I thought it was just an accidental bug or missed corner case, especially as I've been using the great d3.js idiom selection.classed('active', bool_or_function_returning_bool) long enough to have that hard-wired, rather than breaking it down into multiple discrete manual steps in separate chained commands, or using a more complex chain, as in the fallback I opted for above.

It would just delight me if jQuery matched intuition.

Changed October 02, 2012 11:32PM UTC by comment:5

Changed October 09, 2012 12:08PM UTC by sindresorhus comment:6

component: unfiledcss
priority: undecidedlow



Changed October 15, 2012 04:08PM UTC by timmywil comment:7

component: cssattributes
keywords: → 1.9-discuss
status: newopen
type: bugfeature

Changed October 22, 2012 05:23PM UTC by mikesherov comment:8


Changed October 22, 2012 05:51PM UTC by gnarf comment:9

+0, What gets passed into the function... index, hasClass ???

Changed October 29, 2012 05:37PM UTC by dmethvin comment:10

-1, not needed

Changed October 29, 2012 05:38PM UTC by mikesherov comment:11

resolution: → wontfix
status: openclosed