我正在构建一个表单，要求用户提供姓名、地址、金额1、金额2和一条评论。
amount1 和 amount2 的单选数值不同。
当我提交表单时，我的变量 $rate_error 返回 “您必须输入评级评论”;，即使它不为空。
我的 radio 输入可能有问题吗？
我对 amount1 变量的赋值是否错误？
当用户选择不同的金额时，我需要更改变量的值。
HTML
<form id='main-rate' method="POST">
<input type="search" name="address" id="geocomplete" placeholder="Type in an address"/>
<input type="text" name='landlord_name id="name" '/>
<input type="radio" name="amount1" id="amount1" value="2">
<label for"amount1">2<label>
<input type="radio" name="amount1" id="amount1" value="4">
<label for"amount1">4<label>
<input type="radio" name="amount1" id="amount1" value="6">
<label for"amount1">6<label>
<input type="radio" name="amount1" id="amount1" value="8">
<label for"amount1">8<label>
<input type="radio" name="amount1" id="amount1" value="10">
<label for"amount1">10<label>
<input type="radio" name="amount2" id="amount2" value="2">
<label for"amount2">2<label>
<input type="radio" name="amount2" id="amount2" value="4">
<label for"amount2">4<label>
<input type="radio" name="amount2" id="amount2" value="6">
<label for"amount2">6<label>
<input type="radio" name="amount2" id="amount2" value="8">
<label for"amount2">8<label>
<input type="radio" name="amount2" id="amount2" value="10">
<label for"amount2">10<label>
<textarea id="comment" name="comment" required="required">
</textarea>
<button type='submit'>Submit</button>
</form>
JavaScript
$(document).ready(function()
{
$("#main-rate").submit(function()
{
var address = $('#geocomplete').val();
var name = $("#name").val();
var comment = $('#comment').val();
var amount1 = document.getElementsByName('amount1');
for (var i = amount1.length; i--;) {
amount1[i].onchange = function() {
amount1 = this.value;
console.log(amount1);
}
}
var amount2 = document.getElementsByName('amount2');
for (var i = amount2.length; i--;) {
amount2[i].onchange = function() {
amount1 = this.value;
console.log(amount2);
}
}
var dataString = name + address + amount1 + amount2 + comment;
if (name == '' || address == '' || amount1 == '' || amount2 == '' || comment == '')
{
console.log("Please Fill All Fields");
} else
{
// AJAX Code To Submit Form.
$.ajax({
type: "POST",
url: "path/to/url",
data: dataString,
cache: false,
success: function(result)
{
console.log(result);
$('rate-section').html(
'<div><h1>THANKS FOR RATING!</h1></div>'
);
return false;
}
});
}
return false;
});
});
PHP
$rate_error = 0;
if (isset($comment) && $comment != '') {
if (!$address_id && !$address) {
$rate_error = "must enter an address";
}
//if not logged in and creating new user
if (!$SESSION->logged_in()) {
$User = new USER();
$rate_error = $User->createUser($username_entered, $email_entered, $pass_1, $pass_2, $fb_user, $g_user, $g_token, 1);
}
if (!$rate_error && !$SESSION->user_id()) {
$rate_error = "error - you must create an account before rating a landlord";
}
if (!$comment) {
$rate_error = "you cannot leave a blank review";
}
if (!$landlord_id && !$landlord_name) {
$rate_error = "you must enter a landlord name";
}
} else {
$rate_error = "you must enter a rating comment";
}
if (($landlord_name || $landlord_id) && $rate_error==0) {
//query to database
$success = 1;
}
if ($success){
$resultArray = array("success"=>1);
$resultArray['landlord'] = $current_landlord;
} else {
$resultArray = array("success"=>0,
"rate_error"=>$rate_error);
}
更新
对我的 JavaScript 进行了一些更改，但现在收到 500 内部错误。
$("#main-rate").submit(function()
{
var address = $('#geocomplete').val();
var name = $("input[name='landlord_name']").val();
var amount1 = $("input[name='amount1']").val();
var amount2 = $("input[name='amount2']").val();
var amount3 = $("input[name='amount3']").val();
var amount4 = $("input[name='amount4']").val();
var amount5 = $("input[name='amount5']").val();
var amount6 = $("input[name='amount6']").val();
var amount7 = $("input[name='amount7']").val();
var comment = $('#comment').val();
var dataString = {
name: name,
address: address,
amount1: amount1,
amount2: amount2,
amount3: amount3,
amount4: amount4,
amount5: amount5,
amount6: amount6,
amount7: amount7,
comment: comment
}
if (dataString.name == '' || dataString.address == '' || dataString.amount1 == '' || dataString.amount2 == '' || dataString.amount3 == '' || dataString.amount4 == '' || dataString.amount5 == '' || dataString.amount6 == '' || dataString.amount7 == '' || dataString.comment == '')
{
console.log("Please Fill All Fields");
} else
{
// AJAX Code To Submit Form.
$.ajax({
type: "POST",
url: "path/to/url",
data: dataString,
cache: false,
success: function(result)
{
console.log(result);
$('rate-section').html(
'<div><h1>THANKS FOR RATING!</h1></div>'
);
return false;
}
});
}
return false;
});
});
最佳答案
正如@ShaunakD 指出的，您没有正确地将数据发送到服务器。如果您的所有输入都填写了字母“a”，它仍然会提交，但 PHP 会收到“aaaaa”(好吧，不是技术上的，考虑到下面的单选和 amount1&2 赋值问题)，没有任何指示正在传递哪些变量。
我建议他的第一种方法将您的 dataString 分配行更改为:
var dataString = {
name: name,
address: address,
amount1: amount1,
amount2: amount2,
comment: comment
};
您当前的实现在检索 amount1 和 amount2 的值时会出现问题。您正在为提交函数中的 onchange 分配事件。您应该首先删除每个 radio 输入的 id 属性，并将它们的值分配(更简单)替换为:
var amount1 = $("input[name='amount1']").val();
var amount2 = $("input[name='amount2']").val();
编辑:为下面我的第一条评论提供更多背景信息:
$("#main-rate").submit(function()
{
var address = $('#geocomplete').val();
var name = $("#name").val();
var comment = $('#comment').val();
var amount1 = $('input[name="amount1"]').val();
var amount2 = $('input[name="amount2"]').val();
//Remove this entirely
/*
var amount1 = document.getElementsByName('amount1');
for (var i = amount1.length; i--;) {
amount1[i].onchange = function() {
amount1 = this.value;
console.log(amount1);
}
}
var amount2 = document.getElementsByName('amount2');
for (var i = amount2.length; i--;) {
amount2[i].onchange = function() {
amount1 = this.value;
console.log(amount2);
}
}
*/
祝你好运!
关于javascript - 通过 Ajax 向 PHP 后端提交表单返回错误，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/30106122/