How to show jquery message after clicking on submit button
I am new to jquery and would like 开发者_运维百科to learn how to show a message (e.x please wait in green color or submitting ) after clicking on the submit button.
Can you please help
After you click on a submit button usually the form is submitted to the server and all client script execution stops. So unless you AJAXify your form it won't work. In order to AJAXify your form you could attach to the submit event and replace the default action:
$(function() {
$('#theForm').submit(function() {
// show a hidden div to indicate progression
$('#someHiddenDiv').show();
// kick off AJAX
$.ajax({
url: this.action,
type: this.method,
data: $(this).serialize(),
success: function() {
// AJAX request finished, handle the results and hide progress
$('#someHiddenDiv').hide();
}
});
return false;
});
});
and your markup:
<form id="theForm" action="/foo" method="post">
<input name="foo" type="text" />
<input type="submit" value="Go" />
</form>
<div id="someHiddenDiv" style="display: none;">Working...</div>
May be this will help:
$('#submitButtonID').click(function(){
alert('Please wait while form is submitting');
$('#formID').submit();
});
Ajaxifying the form is not needed. You can just show a hidden div element during submit. As long as the server side hasn't sent any bit of the response back, the webbrowser will keep displaying the initial page.
You can use CSS display: none to initially hide an element. You can use jQuery.show() to show the element(s) matching the selector.
<!DOCTYPE html>
<html lang="en">
<head>
<title>SO question 3377468</title>
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<script>
$(document).ready(function() {
$('#form').submit(function() {
$('#progress').show();
});
});
</script>
<style>
#progress {
display: none;
color: green;
}
</style>
</head>
<body>
<form id="form" action="servlet-url" method="post">
...
<input type="submit">
</form>
<div id="progress">Please wait...</div>
</body>
</html>
So, as long as you are not using scriptlets in JSP to run heavy business stuff, but rather a servlet class which in turn displays the JSP at end of the processing, it'll work as you expect.
加载中,请稍侯......
精彩评论