#195 enhancement
dobby

New method setVisible(boolean) on Element

Reported by dobby | June 30th, 2008 @ 04:05 PM | in 1.7

The show, hide, toggle methods are great on the element object but it

would also be nice to have a setVisisble(boolean) method. This allows

you to set the visibility of an element depending on a Boolean

expression. With the current api you have to if else this behavior.

Example:

$("myelement").setVisible(element.checked);

With the current api you would have to do something like this:

if(element.checked){
  $("myelement").show();
}else {
  $("myelement").hide(); 
}

Comments and changes to this ticket

  • Nick Stakenburg

    Nick Stakenburg June 30th, 2008 @ 04:49 PM

    I don't think it's that useful. You can use Element#toggle or if it's about having a one liner use something like this.

    $(element)[$('checkbox').checked ? 'show' : 'hide']();
    
  • John-David Dalton

    John-David Dalton June 30th, 2008 @ 06:31 PM

    I agree with Nick on this. You can always add something like that to your own projects via the Element.addMethods though.

    I think the name of the method would have to be tweaked.

    You might even do something like:

    
    Element.Methods.toggle = Element.Methods.toggle.wrap(proceed, element, conditional) {
      element = $(element);
      if (arguments.length === 3) {
        if (Object.isFunction(conditinal))
          conditional = conditional.call(element);
        return element[ conditional ? 'show' : 'hide' ]();
      }
      return proceed(element);
    };
    
    Element.addMethods();
    
    
  • Andrew Dupont

    Andrew Dupont June 30th, 2008 @ 07:48 PM

    • State changed from “new” to “enhancement”
    • Milestone set to 1.7

    We had talked about adding boolean arguments to Element#toggle and Element#toggleClassName that would enable this. It'd be backwards-compatible. I am in favor of it, but let's talk about it again when 1.6.1 nears.

  • Juriy Zaytsev

    Juriy Zaytsev June 30th, 2008 @ 08:16 PM

    This is actually useful.

    I use similar method all the time (http://github.com/kangax/protoli...).

    +1 (by 1.6.1)

  • John-David Dalton

    John-David Dalton June 30th, 2008 @ 08:39 PM

    • State changed from “enhancement” to “new”
    • Milestone cleared.

    cool :)

  • dobby

    dobby June 30th, 2008 @ 09:14 PM

    The proposal with the extra optional boolean in toggle is really nice, it's backwards compatible and doesn't add an extra method. I like it.

    I disagree that the following syntax

    @@javascript

    $(element)[$('checkbox').checked ? 'show' : 'hide']();

    @@

    It is very ugly and actually proves that internally prototype needs the function. If the toggle with boolean would exist you could replace the example with a call to the toggle method.

    Adding your own method for something as simple and obvious as this functionality seems clumsie, prototype is all about making it easy to manipulate the dom. I agree that special methods specific to your project should not integrated into the core prototype lib but this is not the case in this very generic method.

  • John-David Dalton

    John-David Dalton June 30th, 2008 @ 09:15 PM

    • State changed from “new” to “enhancement”
    • Milestone set to 1.7
    • Assigned user set to “Juriy Zaytsev”

    oops donno why it cleared mileston and state...

    I think it should allow a conditional method to be passed as well (via my example)

  • Tobie Langel

    Tobie Langel July 24th, 2009 @ 02:11 AM

    • Tag changed from element to element, section:dom

    [not-tagged:"dom" tagged:"section:dom" bulk edit command]

  • Tobie Langel

    Tobie Langel July 24th, 2009 @ 02:12 AM

    • Tag changed from element, section:dom to section:dom

    [not-tagged:"element" bulk edit command]

  • T.J. Crowder

    T.J. Crowder November 16th, 2009 @ 04:50 PM

    • Assigned user cleared.

    [responsible:none bulk edit command]

Please Sign in or create a free account to add a new ticket.

With your very own profile, you can contribute to projects, track your activity, watch tickets, receive and update tickets through your email and much more.

New-ticket Create new ticket

Create your profile

Help contribute to this project by taking a few moments to create your personal profile. Create your profile ยป

The Prototype JavaScript library.

Shared Ticket Bins

Pages