Results 1 to 2 of 2

Thread: show content with reset button

  1. #1
    Join Date
    Feb 2005
    Posts
    15
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default show content with reset button

    Hi, I'm stumped.

    The code below hides content when a checkbox is checked and shows content when unchecked.
    What I need to do is the following when the reset button is clicked:

    uncheck all checkboxes and show all content.
    Thank you.


    <html>
    <head>

    <script type="text/javascript" language="JavaScript">
    function ReverseContentDisplay(d) {
    if(document.getElementById(d).style.display == "none") { document.getElementById(d).style.display = ""; }
    else { document.getElementById(d).style.display = "none"; }
    }
    </script>

    </head>

    <body>
    <form>
    <table>
    <tr><td>
    <input type="checkbox" name="checkbox3" value="checkbox" onclick="javascript:ReverseContentDisplay('one');">
    </td>
    <td>
    <div id="one">
    <p>1.</p>
    </div>
    </td>
    <tr><td>
    <input type="checkbox" name="checkbox3" value="checkbox" onclick="javascript:ReverseContentDisplay('two');">
    </td>
    <td>
    <div id="two">
    <p>2.</p>
    </div>
    </td></tr>
    <tr><td>&nbsp;</td>
    <td>
    <input name="" type="reset">
    </td>
    </tr>
    </table>
    </form>

    </body>
    </html>

  2. #2
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,495
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    Code:
    <html>
    <head>
    
    <script type="text/javascript" language="JavaScript">
    function ReverseContentDisplay(d, el) {
    document.getElementById(d).style.display=el.checked? 'none' : '';
    }
    onload=function() {
    var i=document.getElementsByTagName('input');
    for (var i_tem = 0; i_tem < i.length; i_tem++)
    if (i[i_tem].onclick&&i[i_tem].onclick.toString().indexOf('ReverseContentDisplay')>-1)
    i[i_tem].onclick();
    }
    
    </script> 
    
    </head>
    
    <body>
    <form>
    <table>
    <tr><td>
    <input type="checkbox" name="checkbox3" value="checkbox" onclick="ReverseContentDisplay('one',this);"> 
    </td>
    <td>
    <div id="one">
    <p>1.</p>
    </div>
    </td>
    <tr><td>
    <input type="checkbox" name="checkbox3" value="checkbox" onclick="ReverseContentDisplay('two',this);"> 
    </td>
    <td>
    <div id="two">
    <p>2.</p>
    </div>
    </td></tr>
    <tr><td>&nbsp;</td>
    <td>
    <input name="" type="reset" onclick="setTimeout('onload()', 100);">
    </td>
    </tr>
    </table>
    </form>
    
    </body>
    </html>
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

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
  •