为什么我的Ajax表单没有提交正确的值?

时间:2015-12-24 11:55:16

标签: php jquery ajax forms

我有一个工作表单,可以将星级评分(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!";
}
?>

4 个答案:

答案 0 :(得分:1)

您错过了id

中的<input type='hidden' ...>

并在此处进行更改为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();

答案 1 :(得分:1)

你的问题就在这一行:

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

将选择名称为&#34; star&#34;的所有按钮。并告诉你其中一个的价值(大概是第一个,因为你总是得到5个)。

尝试使用此选项仅获取所选的一个:

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

答案 2 :(得分:0)

将其更改为

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

现在您选择所有单选按钮,而不仅仅是选中的按钮,val()每次都会从集合中的第一个元素返回值,即5。\ br /> 您只需选中已选中的单选按钮,即可获得它的值。

答案 3 :(得分:0)

通过此更改var star

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