Ajax, jquery form plugin won't work
I'm trying to use the malsup jquery form plugin and I can't get the simple example to work (http://jquery.malsup.com/form/#ajaxForm). I've pasted my code below. What is going wrong? All that happens is I get an alert box that says "Thank you for your comment!". Nothing else happens.
Thanks,
Mark
This is the ajaxtest.html file:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="ht开发者_如何学Pythontp://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="javascript/jquery.js"></script>
<script type="text/javascript" src="javascript/jquery.form.js"></script>
<script type="text/javascript">
// wait for the DOM to be loaded
$(document).ready(function() {
var options = {
target: '#output1', // target element(s) to be updated with server response
beforeSubmit: showRequest, // pre-submit callback
success: showResponse // post-submit callback
};
// bind 'myForm' and provide a simple callback function
$('#myForm').ajaxForm(function() {
alert("Thank you for your comment!");
});
});
function showRequest(formData, jqForm, options) {
alert("calling before sending!");
return true;
}
function showResponse(responseText, statusText, xhr, $form) {
alert("this is the callback post response");
}
</script>
<script>
</script>
</head>
<body>
<form id="myForm" action="form/report.php" method="post">
Name: <input type="text" name="name" />
Comment: <textarea name="comment"></textarea>
<input type="submit" value="Submit Comment" />
<div id="output1"></div>
</form>
</body>
</html>
This is the PHP file:
<?php
echo '<div style="background-color:#ffa; padding:20px">' . $_POST['message'] . '</div>';
?>
You don't use the options variable anywhere, you only define it.
You need to pass your "options" object into the ajaxForm call, and set up your success function in that (that is, in the options object). See this page: http://jquery.malsup.com/form/#options-object
加载中,请稍侯......
精彩评论