[英]AJAX JQuery POST Not Working
I am unable to read the POST values I expect in my PHP script. 我无法读取PHP脚本中期望的POST值。 The request goes through it just does not serialize the data properly into the POST request aspect of it all.
请求通过它只是没有正确地将数据序列化到所有这一切的POST请求方面。 There is a moderate amount of code and I would rather you skip this than downvote it as I need help desperately and I know many of you do not wish to spend your time answering this long of a question.
代码数量适中,我宁愿您跳过这一步,也不愿对其投反对票,因为我急切需要帮助,而且我知道你们中的许多人不愿意花时间回答这么长时间的问题。
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<form action="/core/enrollphase1.php" id="enrollPhase1" method="post" name="enrollPhase1">
<select class="inputGeneral" id="SecurityQuestion1" style="font-size:20px;">
<option value="1">
What is your favorite book?
</option>
<option value="2">
What is your favorite movie?
</option>
<option value="3">
What is your favorite TV show?
</option>
<option value="4">
What is your pet's name?
</option>
<option value="5">
What is your favorite hobby?
</option>
</select><br>
<br>
<input class="inputGeneral" id="SecurityAnswer1" type="text"><br>
<br>
<select class="inputGeneral" id="SecurityQuestion2" style="font-size:20px;">
<option value="1">
What is your favorite book?
</option>
<option value="2">
What is your favorite movie?
</option>
<option value="3">
What is your favorite TV show?
</option>
<option value="4">
What is your pet's name?
</option>
<option value="5">
What is your favorite hobby?
</option>
</select><br>
<br>
<input class="inputGeneral" id="SecurityAnswer2" type="text"><br>
<br>
<input class="inputGeneral" type="submit" value="Continue">
</form>
</body>
</html>
$(document).arrive("#enrollPhase1", function() {
// Auto Correct Questions
$("#SecurityQuestion1").on("change", function() {
if(this.value === $("#SecurityQuestion2").val()) {
// Notify that same question will not fly with us
} else {
// If something changes and they are no longer the same, remove all errors
}
})
$("#SecurityQuestion2").on("change", function() {
if(this.value === $("#SecurityQuestion1").val()) {
// Notify that same question will not fly with us
} else {
// If something changes and they are no longer the same, remove all errors
}
})
// Get EnrollPhase1 Form...
var EnrollPhase1Form = $('#enrollPhase1');
$(EnrollPhase1Form).submit(function(event) {
// Catch Browser Submitting Form
event.preventDefault();
// Temp Hold Security Question IDs to check for same question
var SQ1 = $("#SecurityQuestion1").find(":selected").val();
var SQ2 = $("#SecurityQuestion2").find(":selected").val();
if(SQ1 === SQ2) {
// Same question issue
return;
}
// Temp Hold Security Question Answers to check for same answer
var SA1 = $("#SecurityAnswer1").val();
var SA2 = $("#SecurityAnswer2").val();
if(SA1 === SA2) {
// Same answer issue
return;
}
// Hide UsernameForm...
$("#enrollPhase1Container").hide();
// Error Message Response Removal
$(".success, .error, .warning, .info").remove();
// Start animationSpin
$("#animationSpin").removeClass("hidden");
// Serialize the form data
alert(JSON.stringify(EnrollPhase1Form));
var formData = $(EnrollPhase1Form).serialize();
// Submit the form using AJAX.
$.ajax({
type: $(EnrollPhase1Form).attr('method'),
url: $(EnrollPhase1Form).attr('action'),
data: formData,
statusCode: {
500: function() {
// Done animationSpin
$("#animationSpin").addClass("hidden");
// Error Message Callback
$(".status").append("<div class=\"error\"><span class=\"closebtn\" onclick=\"this.parentElement." +
"style.display='none';\">×</span>" + "<h4>Server Returned 500 Error Code</h4>" + "</div>");
// Show Form Again
$("#enrollPhase1Container").show();
}
}
})
.done(function(response) {
window.setTimeout(function(){
$("#animationSpin").addClass("hidden");
if(response == "REFRESH") {
location.reload();
} else if(response.startsWith("Error")) {
// Error Message Adding
$(".status").append("<div class=\"error\"><span class=\"closebtn\" onclick=\"this.parentElement.style.display='none';\">" +
"×</span>" + response.replace("Error", "") + "</div>");
// Increase height
$("#loginContainer").height("70%");
// Show Form Again
$("#enrollPhase1Container").show();
} else {
// Remove UsernameForm...
$("#enrollPhase1Container").remove();
// Decrease height
$("#loginContainer").height("50%");
// Set the message text.
$("#login").append(response);
}
}, 1000)
})
});
});
// Do we have
var_dump($_POST);
You forgot the name
attribute on all your form elements. 您忘记了所有表单元素上的
name
属性。 They are still required for .serialize
(so it can give a post variable its name for the value). .serialize
仍然需要.serialize
(因此它可以为post变量指定值的名称)。 So adjust your form elements: 因此,调整您的表单元素:
<form action="/core/enrollphase1.php" id="enrollPhase1" method="post" name="enrollPhase1">
<select .. id="SecurityQuestion1" name="SecurityQuestion1"></select>
<input .. id="SecurityAnswer1" name="SecurityAnswer1" type="text">
<select .. id="SecurityQuestion2" name="SecurityQuestion2"></select>
<input .. id="SecurityAnswer2" name="SecurityAnswer2" type="text">
<input .. type="submit" value="Continue">
</form>
Now when you get them from the $_POST
array, you should see them as: 现在,当您从
$_POST
数组中获取它们时,应该将它们显示为:
$_POST['SecurityQuestion1']
$_POST['SecurityAnswer1']
$_POST['SecurityQuestion2']
$_POST['SecurityAnswer2']
As a side note, your usage of selectors in the jquery is a bit, odd. 附带说明一下,您在jquery中使用选择器有点奇怪。 I would suggest you change to the following (for just these lines):
我建议您更改为以下内容(仅针对这些行):
$("#enrollPhase1").submit(function(event) {
....
$.ajax({
type: $(this).attr('method'),
url: $(this).attr('action'),
data: $(this).serialize(),
....
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.