Solved

Help with check box disabled state

Posted on 2011-09-25
4
197 Views
Last Modified: 2012-05-12
Hey all,

Need help with script that removes the disabled state of a button when a checkbox is clicked. The default state of the checkbox is unchecked and the default state of the button is disabled.

When the user checks the box the disabled state and disabled class is removed.

<input type="checkbox" name="term" value="Bike" />

<button type="button" disabled="disabled" class="disabled">Click Me!</button>

The framework Im using is jQuery. Thanks for your help.



0
Comment
Question by:yando18
  • 2
  • 2
4 Comments
 
LVL 82

Expert Comment

by:leakim971
ID: 36596307
test page : http://jsfiddle.net/35h5r/1/

$(document).ready(function() {
    
$(":checkbox[name='term'][value='Bike']").click(function() {
    if( $(this).is(":checked") ) {
        $("button").removeAttr("disabled");
    }
    else {
        $("button").attr("disabled",true);
    }
})
    
    })

Open in new window


replace the selector $("button") if you give an ID to your button
0
 

Author Comment

by:yando18
ID: 36596385
must also remove the class disabled
0
 
LVL 82

Accepted Solution

by:
leakim971 earned 500 total points
ID: 36596393
updated : http://jsfiddle.net/35h5r/2/
$(document).ready(function() {
    
$(":checkbox[name='term'][value='Bike']").click(function() {
    if( $(this).is(":checked") ) {
        $("button").removeAttr("disabled").removeClass("disabled");
    }
    else {
        $("button").attr("disabled",true).addClass("disabled");
    }
})
    
    })

Open in new window

0
 

Author Comment

by:yando18
ID: 36596400
That should do it thanks
0

Featured Post

Independent Software Vendors: We Want Your Opinion

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

When it comes to write a Context Sensitive Help (an online help that is obtained from a specific point in state of software to provide help with that state) ,  first we need to make the file that contains all topics, which are given exclusive IDs. …
Because your company can’t afford for you to make SEO mistakes, you’ll want to ensure you’re taking the right steps each and every time you post a new piece of content. This list of optimization do’s and don’ts can help you become an SEO wizard.
This video teaches users how to migrate an existing Wordpress website to a new domain.
Learn how to create flexible layouts using relative units in CSS.  New relative units added in CSS3 include vw(viewports width), vh(viewports height), vmin(minimum of viewports height and width), and vmax (maximum of viewports height and width).

685 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question