为什么我的Ajax表单不提交正确的值？

Question

我有一个工作表单，将星级评分（1到5）保存到mysql数据库。我现在试图使这个表单提交与Ajax，但我只有得到值“5”保存到我的数据库（所有其他变量保存很好）。谁能告诉我什么是错的？非常感谢。

表单

<form> 
<input class="star star-5" id="star-5" type="radio" name="star" value="5"/> 
<label class="star star-5" for="star-5"></label> 
<input class="star star-4" id="star-4" type="radio" name="star" value="4"/> 
<label class="star star-4" for="star-4"></label> 
<input class="star star-3" id="star-3" type="radio" name="star" value="3"/> 
<label class="star star-3" for="star-3"></label> 
<input class="star star-2" id="star-2" type="radio" name="star" value="2"/> 
<label class="star star-2" for="star-2"></label> 
<input class="star star-1" id="star-1" type="radio" name="star" value="1"/> 
<label class="star star-1" for="star-1"></label> 
<input type="hidden" name="username" value="<?php echo $username;?>"> 
<input type="hidden" name="film_id" value="<?php echo $film_id;?>"> 

<button type="submit" id="FormSubmitRate" class="btn btn-primary btn-xs pull-right">Rate!</button> 

</form> 

jQuery的

//Add Rating 
    $(document).ready(function(){ 
    $("#FormSubmitRate").click(function (e) { 
    e.preventDefault(); 

var username=$("#username").val(); 
var film_id=$("#film_id").val(); 
var star=$("[name=star]").val(); 

$.post('ajax_addrating.php', {username: username, film_id: film_id, star: star}, 
function(data){ 
$("#message").html(data); 
$("#message").hide(); 
$("div.success").fadeIn(500); //Fade in the data given by the insert.php file 
$("div.success").fadeOut(2500); //Fade in the data given by the insert.php file 
$("div.success").html(); 
}); 
return false; 
}); 
    }); 
    </script> 

ajax_addrating.php

<?php 
//include db configuration file 
include_once("config.php"); 
//Configure and Connect to the Database 
if (!$mysqli) { 
die('Could not connect: ' . mysqli_error()); 
} 


$username=$_POST['username']; 
$film_id=$_POST['film_id']; 
$rating=$_POST['star']; 
//Insert Data into mysql 

$stmt = $mysqli->prepare('INSERT user_reviews SET rating = ?, film_id=?, username=?'); 
$stmt->bind_param('sss', $rating, $film_id, $username); 
$stmt->execute(); 
if ($stmt->errno) { 
echo "There was an error " . $stmt->error; 
} else{ 
echo " Success!"; 
} 
?> 

Answer 1

将其更改为

var star = $("[name=star]:checked").val(); 

现在您正在选择所有单选按钮，而不仅仅是已选中的单选按钮，并且val()每次都返回集合中第一个元素的值，即5。
你必须选择只有选中的单选按钮，并获得它的值为。

Answer 2

您在<input type='hidden' ...>

错过id而且，在这里更改为var star=$("[name=star]:checked").val();

变化

<input type="hidden" name="username" value="<?php echo $username;?>"> 
<input type="hidden" name="film_id" value="<?php echo $film_id;?>"> 

要

<input type="hidden" id='username' name="username" value="<?php echo $username;?>"> 
<input type="hidden" id='film_id' name="film_id" value="<?php echo $film_id;?>"> 

而且，

变化

var star=$("[name=star]").val(); 

要

var star=$("[name=star]:checked").val(); 

编辑代码

<input type="hidden" id='username' name="username" value="<?php echo $username;?>"> 
<input type="hidden" id='film_id' name="film_id" value="<?php echo $film_id;?>"> 

var username=$("#username").val(); 
var film_id=$("#film_id").val(); 
var star=$("[name=star]:checked").val(); 

Answer 3

你的问题是这样的一行：

var star=$("[name=star]").val(); 

，它将选择名称为“star”的所有按钮，并为您提供其中一个按钮的值（可能是第一个，因为您总是获得5）。本

var star=$("[name=star]:checked").val(); 

Answer 4

变化var star：

，而不是尝试使用此方法只能获得一个选择

var star=$("[name=star]:checked").val();