CODEWITHSUNDEEP
jqueryasp.net-mvcasp.net-mvc-3
Nil
Nil

Reputation: 133

how to make button disabled using JQuery?

I am developing MVC application. I have check box and submit button.

I want to enable submit button on check box's checked event and on unchecked submit button should disable.

How to do this ?

I have below code....

    @model PaymentAdviceEntity.Account
    @using PaymentAdviceEntity;


    @{
        ViewBag.Title = "Create";
        PaymentAdvice oPA = new PaymentAdvice();
        oPA = (PaymentAdvice)ViewBag.PaymentAdviceObject;

      <div>
             <input type="checkbox" class="optionChk" value="1" /> Paid
        </div>

    <input type="submit" value="Create"  />
    <input type="button"  class="btn-primary" />
    }

    <script type="text/javascript">
$(".optionChk").on("change", function () {
    if ($(this).is(":checked"))
    {
        alert("1");

        $(".SubmitButton").attr("disabled", "disabled"); 
    } else 
    {
        alert("2");

        $(".SubmitButton").attr("enable", "enable"); 
    }    
});
</script>

Upvotes: 0

Views: 9140

Answers (4)

Hitesh Modha
Hitesh Modha

Reputation: 2790

Disable Submit Button:

$(".optionChk").on("change", function () {

if ($(this).is(":checked")) 
{
$("input[type='submit']").attr('disabled',false); //button will be enabled
}
else
{
$("input[type='submit']").attr('disabled',true); //button will be disabled
}
})

Code to enable or disable submit button :

$("input[type='submit']").attr('disabled',true); //button will be disabled

Upvotes: 0

wirey00
wirey00

Reputation: 33661

You should be using prop to set/get the disabled property

$(".optionChk").on("change", function () {
     $("input[type=submit]").prop("disabled",!this.checked);   
});

Also your submit button has no class='Submit' so you need to use the attributes selector.. or give it the class='Submit' and use $('.Submit') in place of $('input[type=submit]')

FIDDLE

Upvotes: 2

Sergio
Sergio

Reputation: 6948

Try this:

$(".optionChk").on("change", function () {
    if ($(this).is(":checked")) {
        $("input[type=submit]").removeAttr("disabled");
    } else {
        $("input[type=submit]").attr("disabled", "disabled");
    }    
});

JSFiddle

Upvotes: 0

Karthik Chintala
Karthik Chintala

Reputation: 5545

Try this:

$(function(){
    $('.optionChk').click(function(){
        $('input[type="submit"]').toggle('fast');
    });

});

and the HTML:

<div>
         <input type="checkbox" class="optionChk" value="1" checked="checked" /> Paid
    </div>

<input type="submit" value="Create"  />

working FIDDLE

Upvotes: 0

Related Questions