开发者

Temporary disabling a Submit Button

I have a form which upload a big file to server. Something like this:

<form id="myform" action="myaction.php">
  <p&开发者_开发知识库gt;
    <!--fields -->
  </p>
  <input type="submit" class="submit" value="Send" />
</form>

I need to prevent the user resubmit the form while the previous processing is not ready. How can I disable submit button before processing and enable the button after submit action?


The correct way to do this in jQuery, as of version 1.6, is with the new prop() method.

Also important is that you attach the event to the form's submit event, NOT to the submit button itself. That way if someone hits enter while filling out the form, like I'm sure we all do, the button will still be disabled.

Correct code:

$("#myform").submit(function() {
    $("#myform .submit").prop('disabled', true);
}

If you really want to block access to the form being submitted multiple times, you would stop the form from being submitted too, not just disable the button:

var myform = $("#myform");
myform.submit(function() {
    if($.data(myform.get(0), 'submitting') {
        return false;
    }

    $.data(myform.get(0), 'submitting', true);
    $(".submit", myform).prop('disabled', true);
});

All other solutions are WRONG! :)

Just kidding, they'll work too, but this will catch more exceptional logic and handles the property correctly.


Try

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

and then

$("input.submit").removeAttr('disabled');


You can add the attribute disabled="true" to the element after they click it.

$('.submit').click(function(){$(this).attr('disabled',true)});

Live Demo


In JQuery you can do it like

$(".submit").click(function() {
  $(".submit").attr("disabled","disabled");
  //Post your form here..
});


you can disable in jquery like this:

$(".submit").attr("disabled","disabled");


Assuming you have jQuery available.

<form id="myform" action="myaction.php" onsubmit="submitForm();">
  <p>
    <!--fields -->
  </p>
  <input id="submit_button" type="submit" class="submit" value="Send" />
</form>

<script>
    function submitForm(){
         $("#submit_button").attr("disabled","disabled");
    }
</script>


You can disable double form submit like this:

<form id="myform" action="myaction.php" onsubmit="this.onsubmit=function(){return false;}">
0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜