How to enable radio group by checkbox?

I did search all over but i still cant fix it. Please help:

Here is my js code:

  • Show checkbox on mouseover shows for every cell in table
  • JQuery: Checkbox Chain not working properly
  • Tracking average of two progress bar with checkboxes
  • HTML checkbox onclick called in Javascript
  • How do I encode a javascript object as JSON?
  • Styling radio button without label
  • <script type="text/javascript">
        $(document).ready(function() {
            $("#email_acc").click(function() {
                if ( $(this).is(":checked") ) {
                    $("#email_group").attr("enabled","enabled");
                }
            });  
    
            $("#system_acc").click(function() {
                if ( $(this).is(":checked") ) {
                    $("#system_group").attr("enabled","enabled");
                }
            }); 
        });
    </script>
    

    The following shows my html code:

    <input type="checkbox" name="email_acc" id="email_acc" />Email Account
    <input type="checkbox" name="sys_acc" id="sys_acc" />System Account
    
    <input type="radio" name="radio_email" value="create" class="email_group" id="radio_email_0" disabled="disabled"/>New
    <input type="radio" name="radio_email" value="change" id="radio_email_1" disabled="disabled"/>Change
    <input type="radio" name="radio_email" value="terminate" id="radio_email_2" disabled="disabled"\ />Termination
    
    <input type="radio" name="radio_system" value="create" class="system_group" id="radio_system_0" disabled="disabled"/>New
    <input type="radio" name="radio_system" value="change" id="radio_system_1" disabled="disabled" />Change
    <input type="radio" name="radio_system" value="terminate" id="radio_system_2" disabled="disabled" />Termination
    

    I donno what is the problem.It just doesn’t work.

  • How to make a div into a checkbox
  • Inconsistencies with prop('checked') when clicked manually or programmatically
  • How to get text() from checkbox if is checked?
  • Ext JS 4: Override format of data sent to the server
  • Losing selection when clicking checkbox label
  • Angular checkboxes in tree view
  • 4 Solutions collect form web for “How to enable radio group by checkbox?”

    There is no "enabled" attribute or property, just a "disabled" attribute or property which can be set to false to enable the element(s) in question. (The “attribute” is in your source html, but dynamic changes are made to the “property”, setting it to a boolean value to disable or not.)

    Unless using an old version of jQuery, you should use the .prop() method to update this property. To enable the whole group of radio buttons you have to select them all by their name attribute (or give them a common class and select by that).

    $("#email_acc").click(function() { 
        if ( this.checked ) {  
            $('input[name="radio_email"]').prop('disabled', false);
        }
    });
    
    // and the same for the other checkbox and group.
    

    Note that your second checkbox has an id="sys_acc" but your JS is trying to select with "#system_acc" – you need to make sure they match.

    If you need to disable the group again if the checkbox is unchecked then you can do the following, removing the if statement and setting the disabled property to the inverse of the checked property:

    $('#email_acc').click(function() { 
        $('input[name="radio_email"]').prop('disabled', !this.checked);
    });
    
    // and again the same idea for the other checkbox and group.
    

    Demo: http://jsfiddle.net/UqTB3/

    Note that in both cases I’ve used this.checked instead of $(this).is(":checked"): I find the former easier to read, and it is more efficient to check the DOM element’s checked property directly than to create a jQuery object and use .is(":checked"). But if you’re really keen on using jQuery for everything you can make the appropriate substitution.

    $(document).ready(function() 
    {
    
        $("#email_acc").click(function()
        { 
            if ( $(this).is(":checked") ) 
            {  
                $("input[name='radio_email']").removeAttr("disabled");
               //      ^----------------enable all the checkbox with common name
            }
        });  
    
        $("#sys_acc").click(function()
       //     ^---------corrected id
        {
            if ( $(this).is(":checked") )
            {   $("input[name='radio_system']").removeAttr("disabled");
           //         ^----------------enable all the checkbox with common name
            }
        }); 
    });‚Äč
    

    DEMO

    DEMO 2

    Code updated for new requirements from OP, cleaned code thanks to nnnnnn

    UPDATED DEMO 3

    1. Add name in input html
    2. name should be the same

      <script type="text/javascript">
         document.getElementById('cek3').onchange = function () {
             document.getElementById('fasilitas_kost1').disabled = !this.checked;
             document.getElementById('fasilitas_kost2').disabled = !this.checked;
             document.getElementById('fasilitas_kost3').disabled = !this.checked;
             document.getElementById('fasilitas_kost4').disabled = !this.checked;
             document.getElementById('fasilitas_kost5').disabled = !this.checked;
             document.getElementById('fasilitas_kost6').disabled = !this.checked;
             document.getElementById('fasilitas_kost7').disabled = !this.checked;
         };
      </script>
      
    $("#email_acc").click(function()
        {
            if ( $(this).is(":checked") )
            {
                $("#email_group").attr("disabled","false");
                      or
                $("#email_group").attr("disabled",false);
            }
        });