Details:
This isn't a necessity that I do this, but if there is a simple way to do it without having to change too much, I'll do it. (i.e. if there isn't a simple solution, I probably won't do it, so don't worry about digging too deep)
In UI Dialog box, button as default class called ui-button so focus on it. Create a function that should trigger dialog box in ready that is on page load. Then use jQuery method prop('disabled', true) to disable that button with class ui-button.
Enable / Disable submit button 1.1 To disable a submit button, you just need to add a disabled attribute to the submit button. $("#btnSubmit"). attr("disabled", true); 1.2 To enable a disabled button, set the disabled attribute to false, or remove the disabled attribute.
How do you disable button until all fields are entered? Just click f12 in your browser, find the submit button in the html, and then remove the disabled ! It will submit the form even if the inputs are empty.
I'm guessing that you don't want them to hit the submit button more than once while the submit is processing.
My approach has been to just hide the button entirely and display some sort of status indicator (animated gif, etc) instead.
Here's a very contrived example (it's technically in prototype but I think a jquery version would be very similar):
<html>
<head>
<script type="text/javascript" src="include/js/prototype.js"></script>
<script type="text/javascript">
function handleSubmit()
{
$('submit').hide();
$('progressWheel').show();
return true;
}
</script>
</head>
<body>
<img src="include/images/progress-wheel_lg.gif" id="progressWheel" style="display:none;"/>
<input type="submit" name="submit" id="submit" value="Submit" onclick="handleSubmit();"/>
</body>
</html>
For all submit buttons, via JQuery, it'd be:
$('input[type=submit]').click(function() { this.disabled = true; });
Or it might be more useful to do so on form submission:
$('form').submit(function() {
$('input[type=submit]', this).attr("disabled","disabled");
});
But I think we could give a better answer to your question if we knew a bit more about the context.
If this is an ajax request, then you'll need to make sure you enable submit buttons again on either success or failure.
If this is a standard HTTP form submission (aside from disabling the button with javascript) and you're doing this to safe guard from multiple submissions of the same form, then you ought to have some sort of control in the code that deals with the submitted data, because disabling a button with javascript might not prevent multiple submissions.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With