Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 4 of 4
  1. #1
    New to the CF scene
    Join Date
    Aug 2008
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Unhappy Show/hide array of textboxes and checkboxes?

    Hi all,

    Major noob here; what I want to do is show/hide an array consisting of one checkbox (ID=pss) and two textbox fields (IDs=images and bases) when a checkbox is checked/unchecked (show when checked) I do not know how to toggle the array off and on, and I've been searching the web for four hours now...about to pull my hair out, so any help at all is MUCH appreciated...here's the lame code I have so far:

    JS:
    <script type="text/javascript">
    function Toggle1
    var arrayJP = new Array("pss","images","bases"); {


    </script>

    HTML:
    <span class="formw">
    <span class="span-1">
    <input type="checkbox" name="Language 1:" id="lang1" value="Japanese" onclick="Toggle1('arrayJP', this)"></span>
    <span class="span-2">Japanese</span>

  • #2
    Regular Coder ninnypants's Avatar
    Join Date
    Apr 2008
    Location
    Utah
    Posts
    504
    Thanks
    10
    Thanked 47 Times in 47 Posts
    I believe something like this would work
    Code:
    function toggle(val){
         if(val){
              for(i=0;i<arrayJP.length;i++){
                   document.getElementById(arrayJP[i]).style.display = 'block';
              }
         }else{
              for(i=0;i<arrayJP.length;i++){
                   document.getElementById(arrayJP[i]).style.display = 'none';
              }
         }
    }
    Code:
    <input type="checkbox" name="Language 1:" id="lang1" value="Japanese" onchange="toggle(this.value)">
    All it does is checks to see if the checkbox has a value if it does they display, and if it doesn't then the check boxes will be hidden

  • #3
    New to the CF scene
    Join Date
    Aug 2008
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    OO, closer!!

    Thank you so much! I think that's getting me closer...

    I have this, which I'm ~assuming~ identifies the IDs (one checkbox and two text boxes) pss, images, and bases as arrayJP. THEN, in the code for the checkbox I want to display the array when checked (id=info), I call the function. However, when I check the checkbox, nothing happens...it appears to me that the info.length values are identical for showing and hiding, should they be different? (The styles of the three array elements are set to display:none)

    Javascript:
    <script type="text/javascript">
    function toggle(val){
    var arrayJP = new Array("pss","images","kbases"); {
    if(val){
    for(i=0;i<info.length;i++){
    document.getElementById(arrayJP[i]).style.display = 'block';
    }
    }else{
    for(i=0;i<info.length;i++){
    document.getElementById(arrayJP[i]).style.display = 'none';
    }
    }
    }
    </script>

    HTML:
    <span class="span-1">
    <input type="checkbox" id="info" name="Required" value="" onchange="toggle(this.value)"></span>
    <span class="span-2">Required</span>
    </span>

  • #4
    Regular Coder ninnypants's Avatar
    Join Date
    Apr 2008
    Location
    Utah
    Posts
    504
    Thanks
    10
    Thanked 47 Times in 47 Posts
    This needs to be the arrays name so that it goes through and hides all the elements.
    Code:
    for(i=0;i<info.length;i++)
    Also if you aren't going to give your check box a value you'll need to do it "onclick" instead of "onchange"


  •  

    Posting Permissions

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