I whipped a demo. Does this do what you want?
http://www.commadot.com/jquery/checkBoxShow.php
Couple of tips:
1. Try to avoid putting onclick handlers in your html. jQuery does
this really easily and makes your html easier to read.
2. getElementByID can be expressed as $("#yourID").dosomething...
Much more concise and jQuery-ish. :)
3. The toggle function will automatically show if hidden and hide if
shown without the IF shatement.
Hope these help. When I first started jQuery, I had to forget everything I
knew about JS (which wasn't much). It just did it all without the muss.
Glen
On Dec 6, 2007 8:30 AM, Ryan <[EMAIL PROTECTED]> wrote:
>
> I'm completely versed in the show/hide options available, but have a
> problem I haven't been able to figure out. I'm hoping jquery will have
> the answer. I have 5 checkbox input options, the first two options
> providing the same show div. For example,
>
> <html>
>
> <head>
> <script type="text/javascript">
> <!--
> function showMe (it, box) {
> var vis = (box.checked) ? "block" : "none";
> document.getElementById(it).style.display = vis;
> }
> //-->
> </script>
> </head>
>
> <body>
>
> <form>
> <input type="checkbox" name="modtype" value="value1"
> onclick="showMe('div1', this)" />value1
>
> <input type="checkbox" name="modtype" value="value2"
> onclick="showMe('div1', this)" />value2
>
> <input type="checkbox" name="modtype" value="value3"
> onclick="showMe('div2', this)" />value3
>
> <input type="checkbox" name="modtype" value="value4"
> onclick="showMe('div3', this)" />value4
>
> <input type="checkbox" name="modtype" value="value5"
> onclick="showMe('div4', this)" />value5
>
> <div class="row" id="div1" style="display:none">Show Div 1</div>
> <div class="row" id="div2" style="display:none">Show Div 2</div>
> <div class="row" id="div3" style="display:none">Show Div 3</div>
> <div class="row" id="div4" style="display:none">Show Div 4</div>
> </form>
>
> </body>
>
> </html>
>
> As you can see, the first two options should show the same div.
> Selecting one or both isn't a problem, the div appears as should, but
> when deselecting one of the checkboxes, the div disappears even though
> one of the checkboxes is still selected.
>
> Does anyone have an idea as to how I can get the div to remain
> selected when one of the two checkboxes is deselected? Or, if either
> of the checkboxes are selected, to provide just one result?
>
> Thanks!
>
