阿贾克斯形式错误
After I push the button, I am getting the following warning and form is duplicated. Any error in the code?
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1254" />
<script src="jquery-ui-1.10.0.custom/jquery-1.9.1.min.js" type="text/javascript"></script>
<title>jquery AJAX</title>
<script language="javascript">
$(document).ready(function(){
var name = $("#name").val();
var sname = $("#sname").val();
var email = $("#email").val();
$("#b1").click(function(){
$.ajax({
type :"POST",
URL :"save.php",
data :"name="+name+"&sname="+sname+"&email="+email,
dataType:"text",
success :function (data, textStatus, jqXHR) {
if (data == 'success'){
$("#res").html("sonuc :"+data);
}else{
$("#res").html(data +":"+textStatus+":"+jqXHR);
}
}
});
});
});
</script>
</head>
<body>
<input type="text" id="name"/><br />
<input type="text" id="sname"/><br />
<input type="text" id="email"/><br />
<button id="b1">send</button>
<div id="res"></div>
</body>
</html>
It's doing exactly what it's supposed to do. The error is in this part:
success :function (data, textStatus, jqXHR) {
if (data == 'success'){
$("#res").html("sonuc :"+data);
}else{
$("#res").html(data +":"+textStatus+":"+jqXHR);
}
}
This callback is triggered whenever the AJAX call was successful, but then you check if the data key equals success, which it is not and thus the else clause is now triggered (as can be seen on your screenshot). I believe what you are actaully trying to check is if the textStatus was a success instead. So, replace:
if (data == 'success'){
With this:
if (textStatus == 'success') {
And you should get a sonuc : followed by the data as a result.
Please note that the entire if/else is actually not useful though, since this is already the success callback that is only returned when the AJAX request was a success. You might want to put this:
$("#res").html(data +":"+textStatus+":"+jqXHR);
Into the error callback, so you'll get:
success: function (data, textStatus, jqXHR) {
$("#res").html("sonuc :"+data);
},
error: function (jqXHR, textStatus, errorThrown) {
$("#res").html(data +":"+textStatus+":"+jqXHR);
}