SitePoint Sponsor

User Tag List

Results 1 to 3 of 3

Hybrid View

  1. #1
    SitePoint Member
    Join Date
    Jun 2013
    Location
    Sacramento, CA
    Posts
    2
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Smile Hide then onclick Show Table Rows

    I have the following code which I got from user FauxPas and it works great. But I need one that hides by default and then toggles to SHOW the rows. Does anyone know how to alter this? I have tried just about everything and simply swapping the values doesn't work, setting a default style doesn't work either. FYI... this will be used in a recordset.

    HTML Code:
    <html>
    <head>
    <script>
    function toggle() {
     if( document.getElementById("hidethis").style.display=='none' ){
       document.getElementById("hidethis").style.display = '';
     }else{
       document.getElementById("hidethis").style.display = 'none';
     }
    }
    </script>
    </head>
    <body>
    
    <span onClick="toggle();">toggle</span><br /><br />
    
    <table border="1">
    <tr>
    <td>Always visible</td>
    </tr>
    <tr id="hidethis">
    <td>Hide this</td>
    </tr>
    <tr>
    <td>Always visible</td>
    </tr>
    </table>
    
    </body>
    </html>

  2. #2
    Community Advisor bronze trophy
    fretburner's Avatar
    Join Date
    Apr 2013
    Location
    Brazil
    Posts
    1,401
    Mentioned
    45 Post(s)
    Tagged
    12 Thread(s)
    You need a small change to your JS:
    Code JavaScript:
    function toggle() {
     if( document.getElementById("hidethis").style.display=='none' ){
       document.getElementById("hidethis").style.display = 'table-row'; // set to table-row instead of an empty string
     }else{
       document.getElementById("hidethis").style.display = 'none';
     }
    }

    and amend your html slightly:
    HTML Code:
    <tr id="hidethis" style="display:none;">
    <td>Hide this</td>
    </tr>

  3. #3
    SitePoint Member
    Join Date
    Jun 2013
    Location
    Sacramento, CA
    Posts
    2
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Jeez... I knew it was simple. THANK YOU!!!


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •