Question

I want to disable an input Box AND a button when a checkbox is clicked .

My markup :

<h4>Random or Not </h4>

    <!-- Use Random Image -->  

    <label><input name="o99_aufu_options[o99_aufu_random]" id="o99_aufu_options[o99_aufu_random]" value="1" checked="checked" type="checkbox">Use Random Image ? <em></em></label><br>  

    <!-- If the above not checked - needs to be enabled -->                         
    Upload Image <label for="upload_image"> <input id="upload_image" size="36" name="o99_aufu_options[o99_aufu_upload_image]" value="" type="text"> <input id="upload_image_button" value="Choose Image or upload" type="button"> </label>

jQuery :

if (jQuery('#o99_aufu_options[o99_aufu_random]').is(':checked')) {
       jQuery('#upload_image :input').attr('disabled', true);
    } else {
        jQuery('#upload_image_button,#upload_image :input').removeAttr('disabled');
    }   

well – obviously, if i am asking here – it is not working 🙂

Fiddle :

http://jsfiddle.net/obmerk99/6jFMf/3/

Also as a bonus question – is it possible to do that only with the NAME of the input, omitting the ID from the markup ?

UPDATE I – working solution :

http://jsfiddle.net/obmerk99/6jFMf/20/

Answer 1

bonus question – is it possible to do that only with the NAME of the input, omitting the ID from the markup ?

You can use any attribute in a jQuery selector, including name:

$('[name="foo"])

Since your names have brackets, you’ll probably have to escape them:

$('[name="o99_aufu_options\[o99_aufu_random\]"]')

You can also qualify them to specific elements if you want, or combine them with other selectors:

$('input.someClass[name="o99_aufu_options\[o99_aufu_random\]"]')

As for your actual question, my first guess … is wrong is that your problem is whitespace; have you tried:

#upload_image:input

instead?

My second guess is also wrong that the problem is:

.prop('disabled', true);

Have you tried:

.prop('disabled', 'disabled');

?

Ok, I actually looked at your fiddle, and there were a few things wrong; here’s a working example, let me know if you have questions, but hopefully it’s self-explanatory:

jQuery(function() {
    jQuery('input[name="o99_aufu_options\[o99_aufu_random\]"]').click(function(){
        var isChecked = jQuery(this).is(':checked') ;
        jQuery('#upload_image:input').prop('disabled', isChecked? 'disabled' : null);
    })
});