Dreamer
Dreamer

Reputation: 7551

IE 7 how to disable a button after clicking it

When have a list of input buttons on the UI which sill submit a form.

New requirement is to disable the button after click it. I have tried

j("input.allowed-task").each(function() {
document.getElementById(j(this).attr('id')).disabled = true;
});

and

j("input.allowed-task").attr('disabled', 'disabled');

It all works fine on firefox, IE8, IE9

But when it comes to IE7, neither of above method works. All processes are ignored after the button is disabled, so the form is not even get submit, really don't have an idea how to fix it.

BTW we are on jquery 1.4 so .prop is not supported

Upvotes: 0

Views: 405

Answers (4)

Kevin B
Kevin B

Reputation: 95027

i'd suggest using the submit event rather than click so that you can ensure you catch it, otherwise people can still submit by pressing enter on an input.

$("#myform").submit(function(e){
    // prevent default so that we completely control when the form submits
    e.preventDefault();
    var $form = $(this);
    if ( !$form.data("submitted") ) {
        // form hasn't been submitted yet, set flag, disable button, then submit the form.
        $form.data("submitted",true);
        $("#submitbtn").attr("disabled","disabled"); 
        // obviously disable whatever you need to, 
        // you don't HAVE to disable it though because
        // the flag and e.preventDefault will prevent
        // them from submitting anyway.
        this.submit(); // submits the form, bypassing this submit handler
    }    
});

Upvotes: 2

MonkeyZeus
MonkeyZeus

Reputation: 20737

Is replaceWith() available?

j("input.allowed-task").replaceWith('<input type="submit" disabled="disabled">');

Upvotes: 0

federicot
federicot

Reputation: 12341

Perhaps this is what you're looking for:

j('input.allowed-task').click(function () {
    // Disable the element
    j(this).attr('disabled', 'disabled');

    // Submit the form
    j(this).closest('form').submit();
});

Upvotes: 0

James Montagne
James Montagne

Reputation: 78630

It seems like you should just be able to submit the form in your code directly.

j("input.allowed-task").click(function() {

    // disable all buttons
    j("input.allowed-task").attr('disabled', 'disabled');

    // submit the form
    YOUR_FORM.submit();

    return false;
});

Upvotes: 0

Related Questions