jQuery disable all button of a css class and input type button

Question

<input class="submit2" type="button" name="submit2"  value="Submit" id="submit1" onclick="">

I want to disable the button on my page after clicking it. to avoid double click.

i have tried following code

$(document).ready(function() {

    $('.submit2').click(function() {

        $("input.submit2").attr('disabled', true);

    });
});

but it is working only when the input type of button is submit not button.

how to resolve this issue.

Thanks in advance.

score 2 · Answer 1 · answered Apr 21 '12 at 05:27

2

You don't need to select twice what you already have selected:

$(document).ready(function(){
    $('.submit2').click(function() { 
        $(this).attr('disabled', true);
    }); 
});

$(this) in this case refers to the button you just clicked

answered Apr 21 '12 at 05:27

zerkms

Naren Sisodiya · Answer 2 · 2012-04-21T05:39:55.607

1

also,inorder to make it compatible with all browser, the value of disabled attr should be "disabled"

use it like

$("input.submit2").attr('disabled',"disabled");

The above solution is perfect if you are using jquery version 1.5 and earlier and if you are using jQuery 1.6+ then use prop to set attribute

$("input.submit2").prop('disabled',true); // here jQuery will normalize the value and set the property

edited Apr 21 '12 at 05:39

answered Apr 21 '12 at 05:28

Naren Sisodiya

`disabled` variable is undefined – zerkms Apr 21 '12 at 05:29
jQuery normalizes boolean attributes and allows true/false to be passed afaik. – sg3s Apr 21 '12 at 05:29
@zerkms: it should be string so changed it. – Naren Sisodiya Apr 21 '12 at 05:31
1

@sg3s: JQuery version 1.5 and earlier, the `attr('disabled',true)` was not setting up disabled properly across browsers. so we need to set value as "disabled" not true. here is one similar post [link](http://stackoverflow.com/questions/1414365/how-to-disable-an-input-with-jquery) – Naren Sisodiya Apr 21 '12 at 05:43

score 0 · Answer 3 · edited Apr 21 '12 at 09:23

0

It's an old school HTML relic. The attribute value is 'disabled'='disabled':

$("input.submit2").attr('disabled','disabled');

edited Apr 21 '12 at 09:23

McGarnagle

answered Apr 21 '12 at 05:33

Sujith Kumar KS

score 0 · Answer 4 · edited Nov 17 '12 at 02:05

0

You can do it now:

$(document).ready(function(){
     var $submitButton = $(this, "input[type='submit']");
     $submitButton.attr("disabled", "true");
});

edited Nov 17 '12 at 02:05

Juan Cortés

answered Apr 21 '12 at 06:14

Gopal

4 Answers4