CODEWITHSUNDEEP
javascriptjqueryjquery-ui
David
David

Reputation: 224

Disable Jquery UI Button on form submit

I have a form like so:

<form action="" method="post" id="form" name="form" enctype="multipart/form-data">
<input name="action" type="submit" value="Send" />
</form>

I am using the latest version of the Jquery UI Button plugin. The value of the submit button MUST be submitted. Is there an easy way to disable the submit button after the form has been submitted, without using additional plugins such as "Lock Submit" - http://plugins.jquery.com/project/LockSubmit ?

Many thanks.

Upvotes: 0

Views: 2573

Answers (4)

Salman Arshad
Salman Arshad

Reputation: 272006

When you set the disabled property of an element, it won't be submitted. The workaround is to set the disabled property after the form is submitted. You can use the setTimeout() function with a very short delay:

$("#form").submit(function() {
    setTimeout(function() {
        // .prop() requires jQuery 1.6 or higher
        $("#form :submit").prop("disabled", true);
    }, 100);
});

Demo here

Another trick, is to use a trick :) You can wrap the original submit button inside a div and hide it when the form submits.

Demo here

Upvotes: 3

Cengiz &#214;nkal
Cengiz &#214;nkal

Reputation: 158

Easy just add type="button" to button attributes like

<button type="button" >not submit</button>

Upvotes: 3

Dogbert
Dogbert

Reputation: 222040

$('#form').submit(function() {
  $(this).find('input[type="submit"]').disable();
});

Upvotes: 0

zb&#39;
zb&#39;

Reputation: 8049

you mean

$('#form').submit(function() {$(this).find('input:[type="submit"]').button({disabled:true})});

?

Upvotes: 0

Related Questions