3 Replies Latest reply: Oct 16, 2014 3:18 AM by jamesfootight RSS

    Hide Show toggle issue - can u help?

    jamesfootight Community Member
    jamesfootight Oct 16, 2014 1:55 AM

      Hi, I have a toggle issue!

       

      I have four buttons that each hide show toggle different squares:

       

      button 1 shows yellow and hides green, green1 and blue

      button2 shows green and hides yellow, green1 and blue

      button3 shows green 1 and hides yellow, green and blue

      button4 shows blue and hides yellow, green and green1


      However, if you press button1 and then press button2 the sequence gets confused and hides/shows the wrong ones!

       

      Can you help to ensure that whatever button is pressed it will hide show the correct formation whether you toggle or not?

       

      here is my code for one button1 etc:

       

      // Set a toggle to hide or show an element

      if (sym.$("Green").is(":visible")) {

        sym.$("Green").hide();

      } else {

        sym.$("Green").show();

      }

       

       

      // Set a toggle to hide or show an element

      if (sym.$("Green1").is(":visible")) {

        sym.$("Green1").hide();

      } else {

        sym.$("Green1").show();

      }

       

       

      // Set a toggle to hide or show an element

      if (sym.$("Blue").is(":visible")) {

        sym.$("Blue").hide();

      } else {

        sym.$("Blue").show();

      }

       

      Can you help?

      • 71 Views
      • Tags:
        • 1. Re: Hide Show toggle issue - can u help?
          joel_pau CommunityMVP
          joel_pau Oct 16, 2014 3:06 AM (in response to jamesfootight)

          Hi,

           

          You do not specify which Edge version you are using: Edge 5 with or without the entire jQuery, or an earlier Edge.

           

          1) The jQuery function [ .toggle() ] can solve your issue.

          I quote the jQuery API:

          With no parameters, the .toggle() method simply toggles the visibility of elements:

          1

           
          $( ".target" ).toggle();

           

          The matched elements will be revealed or hidden immediately, with no animation, by changing the CSS display property. If the element is initially displayed, it will be hidden; if hidden, it will be shown. The display property is saved and restored as needed.

           

          2) One of both selectors can also be used: :visible or :hidden.

          • 2. Re: Hide Show toggle issue - can u help?
            jamesfootight Community Member
            jamesfootight Oct 16, 2014 3:12 AM (in response to joel_pau)

            Hi, I am using the latest EDGE update

            • 3. Re: Hide Show toggle issue - can u help?
              jamesfootight Community Member
              jamesfootight Oct 16, 2014 3:18 AM (in response to joel_pau)

              As you can see in my post, I am using the toggle option from the latest EDGE animate, but my issue is that I have 4 different toggle commands from 4 differnet buttons using the same symbols to hide/show.

               

              So, if i hit button 1 to show, then hit button 1 to hide all is well, but if i hit button 1 to show, then button 2 to show, it starts to get confused and the wrong symbols are shown/ hidden