Level Extreme platform
Subscription
Corporate profile
Products & Services
Support
Legal
Français
Show/hide radio buttons based on checkbox state
Message
From
28/01/2014 13:07:32
James Blackburn
Qualty Design Systems, Inc.
Kuna, Idaho, United States
 
 
To
28/01/2014 10:56:28
General information
Forum:
Javascript
Category:
JQueryUI
Miscellaneous
Thread ID:
01592468
Message ID:
01592499
Views:
42
I need to ask the obvious. Is the click event wrapped inside of a $(document).ready()? If not then the click event will fail on page load.

There is also this.
<input type="checkbox" id="aaaa01" class="classtocheckbox" name="aaaa01" />
<label for="aaaa01">this is a test</label>
<input type="checkbox" id="aaaa02" class="classtocheckbox" name="aaaa02" />
<label for="aaaa01">this is a test 2</label>
<script>
    $(document).on('change','.classtocheckbox',function(event){
        var id = "#AHYSChk"+this.id.slice(-2)
         $(id).toggle();
    }
</script>
>Yeah, there are at least 3 rows being created within a FOR loop and each one has a set of checkbox/radio combinations
>
>
>>Hi Dorris,
>>
>>Looks at your code I am wondering if --ch-- changes the ID? If this is the case, it would be easier to use a class like this.
>>
>>
>>    //$(document).on('change','.classtocheckbox',function(event){
>>      //   $('.classtoradiobuttons').toggle();
>>    //}
>>
>>
>>The on() function creates an event and it doesn't matter if the page is not fully rendered when created. Using bind (which click is a shortcut for bind('click').. ) will fail if the DOM is not fully loaded. That is why you need to have bind events inside of $(document).ready() event.
>>
>>If there are more than one set of radio buttons group on the same page then the ID might work better for the radio buttons.
>>
>>
>>>ummm....Unfortunately, that didn't seem to affect it at all. And now that function looks like
>>>
>>>
>>>                       $('#AHYSChk01').click(function()
>>>                           {
>>>                        if $('#AHYSChk01').attr('checked')
>>>                           { $('#YSElig01').show(); 
>>>                           } 
>>>                        else
>>>                           { $('#YSElig01').hide(); 
>>>                           }
>>>                           )}
>>>
>>>
>>>
>>>>I've had issues with .is(:checked) not working. The fallback is $("#CheckBoxId").attr('checked').
>>>>
>>>>
>>>>>Well, I've got the radio buttons initially hidden with
>>>>>
>>>>>
>>>>>       div id = "YSElig<<ch>>" style="display:none">
>>>>>         input type="radio" name="py_SpElig_Type<<ch>>" value="SP" <<iif(lnPY_EligType=1,"checked","")>>/><b>AHYS SUB+Spouse</b>
>>>>>         input type="radio" name="py_SpElig_Type<<ch>>" value="SUB" <<iif(lnPY_EligType=2,"checked","")>>/><b>AHYS SUB Only</b>
>>>>>       div>
>>>>>
>>>>>
>>>>>based off of what I've been reading on jQuery.
>>>>>
>>>>>Unfortunately, checking the box doesn't Show the radiobuttons.
>>>>>
>>>>>>What exactly is the issue?
>>>>>>
>>>>>>
>>>>>>>Hi Gang
>>>>>>>
>>>>>>>Let's pretend that I know very very little about jQuery, so please use small words.
>>>>>>>
>>>>>>>I'm trying to hide/show radiobuttons based off the state of a checkbox and this code is part of a TextMerge VFP section
>>>>>>>
>>>>>>>
>>>>>>>
>>>>>>>                   script type="text/JavaScript" Language = "JavaScript">
>>>>>>>                           $('#AHYSChk01').click(function()
>>>>>>>                           {
>>>>>>>                              if ($'#AHYSChk01').is(:checked))
>>>>>>>                               { $('#YSElig01').show(); 
>>>>>>>                                } 
>>>>>>>                              else
>>>>>>>                               { $('#YSElig01').hide(); 
>>>>>>>                                }
>>>>>>>                           }
>>>>>>>                         
>>>>>>>                      /script>	
>>>>>>>
>>>>>>>where AHYSChknn is the div id for the radiobuttons and AHYSChknn is the checkbox id
>>>>>>>
>>>>>>>I would have included the entire chunk of code, except we can't inline HTML, afaik
>>>>>>>
>>>>>>>Thanks
>>>>>>>
>>>>>>>What am I missing?
Previous
Reply
Map
View

Click here to load this message in the networking platform