Disable Checkbox depending on state of another checkbox

This may be a little overkill for you needs, but I use a bulked up version of this to great effect on my site.

This script will –

  • Check what state the first_option_required option shold be in on page load (and set)

  • Change the state of the first_option_required button upon changes to the first_option_show option. This is managed via an event hadler that will capture changes to the first_option_show option

Double check the input names are correct for your needs and then paste the code in to any JS file that is accessible by the page for which you reqire this functionality.

Note – If you don’t already have a JS file that is included and require help enquing on, let us know.

jQuery(function($){

    /**
     * Once the document is ready, initialise the 'checkResponses' object
     */
    $(document).ready(function(){
        checkResponses.init();
    });

    /**
     * Monitor the change is state to user responses in my form
     */
    checkResponses = {

        /**
         * Psuedo constructor
         */
        init : function(){
            this.create_events();
            this.maybe_disable_first_option_required();
        }, // init

        /**
         * Create events required for monitoring
         */
        create_events : function(){

            var t = this;   // This object

            $('input[name=first_option_show]').on('change', function(){
                t.maybe_disable_first_option_required();
            });

        }, // create_events

        /**
         * Check to see if the 'first_option_required' options should be disabled or not
         */
        maybe_disable_first_option_required : function(){

            if($('input[name=first_option_show]').is(':checked')){
                alert('Removing...');
                $('input[name=first_option_required]').removeAttr('disabled');
            } else {
                alert('Adding...');
                $('input[name=first_option_required]').attr('disabled', true);
            }

        } // maybe_disable_first_option_required

    }

});