#javascript #php #html #jquery
Вопрос:
У меня есть форма, которая принимает три значения: Имя комнаты, Опыт и Рейтинг. Затем эти данные передаются в базу данных. Проблема, с которой я сталкиваюсь, заключается в том, что мое имя комнаты и рейтинг передаются идеально, данные, которые я ввожу в текстовую область, дают мне пустой результат в базе данных. Я перепробовал все способы, но я не могу решить эту проблему. Только в этом проблема, другой код работает нормально.
Пожалуйста, помогите!!!
Вот код:
<?php
include 'db.php';
session_start();
error_reporting(0);
?>
<!DOCTYPE html>
<html>
<head>
<title>Welcome</title>
<!--Bootstrap-->
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-giJF6kkoqNQ00vy HMDP7azOuL0xtbfIcaT9wjKHr8RbDVddVHyTfAAsrekwKmP1" crossorigin="anonymous">
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta1/dist/js/bootstrap.bundle.min.js" integrity="sha384-ygbV9kiqUc6oa4msXn9868pTtWMgiQaeYH7/t7LECLbyPA2x65Kgf80OJFdroafW" crossorigin="anonymous"></script>
<!--User's CSS-->
<link rel="stylesheet" type="text/css" href="../css/feedback.css">
<link rel="stylesheet" type="text/css" href="../css/style.css">
<!--Fonts-->
<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@100;300amp;display=swap" rel="stylesheet">
<!--Font Awesome JS-->
<script src="https://use.fontawesome.com/1033686ccb.js"></script>
<!--JQuery-->
<script src="https://code.jquery.com/jquery-3.5.1.min.js" integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0=" crossorigin="anonymous"></script>
</head>
<body>
<header>
<?php include 'inner-navbar.php';
error_reporting(0);
?>
</header>
<div class="container">
<div id="feedback">
<h3 class="mb-5">Your Feedback</h3>
<form method="post" id="feedback-form">
<div class="row mb-3">
<label class="col-sm-6 col-form-label">Room Name: </label>
<div class="col-sm-6">
<select name="selectedRoomName" id="selectedRoomName" class="form-control">
<?php
$selectQuery="SELECT*FROM bookings where firstname='".$_SESSION['firstname']."';";
$selectQueryResult=mysqli_query($conn,$selectQuery);
if($selectQueryResult){
while($row=mysqli_fetch_assoc($selectQueryResult)){
echo '<option value="'.$row["roomName"].'">'.$row["roomName"].'</option>';
}
}
?>
</select>
</div>
</div>
<div class="row mb-4">
<label class="col-sm-6 col-form-label">Your Experience: </label>
<div class="col-sm-6">
<textarea class="form-control" placeholder="Your Experience" name="experience" id="experience"></textarea>
</div>
</div>
<div class="row mb-5">
<label class="col-sm-6 col-form-label">Your Rating: </label>
<div class="col-sm-6">
<i class="fa fa-star fa-2x" aria-hidden="true" data-index="0"></i>
<i class="fa fa-star fa-2x" aria-hidden="true" data-index="1"></i>
<i class="fa fa-star fa-2x" aria-hidden="true" data-index="2"></i>
<i class="fa fa-star fa-2x" aria-hidden="true" data-index="3"></i>
<i class="fa fa-star fa-2x" aria-hidden="true" data-index="4"></i>
</div>
</div>
<button type="submit" class="btn btn-outline-dark submit" name="submit" id="submit">Submit Feedback</button>
<?php
if(isset($_POST['rating'])){
$roomName=$_POST['selectedRoomName'];
$experience=$_POST['experience'];
$rating=$_POST['rating'];
$submitQuery="INSERT INTO feedback(roomName,experience,rating) VALUES('$roomName','$experience','$rating');";
$submitQueryRes=mysqli_query($conn,$submitQuery);
if($submitQueryRes){
echo '<script>alert("Your Feedback has been Successfully Submitted!");</script>';
}else{
echo '<script>alert("Error: '.$rating.'");</script>';
}
}
?>
</form>
</div>
</div>
</body>
<script type="text/javascript">
var selectedRoomName=$("#selectedRoomName").val();
var experience=$("#experience").val();
var rating=-1;
$(document).ready(function(){
$('.fa-star').click(function(){
rating=parseInt($(this).data('index'));
});
$('.fa-star').mouseover(function(){
resetStarColors();
var value=parseInt($(this).data('index'));
for(var i=0;i<=value;i ){
$('.fa-star:eq(' i ')').css('color','#eb9e34');
}
});
$('.fa-star').mouseleave(function(){
resetStarColors();
if(rating!=-1){
for(var i=0;i<=rating;i ){
$('.fa-star:eq(' i ')').css('color','#eb9e34');
}
}
});
function resetStarColors(){
$('.fa-star').css('color','black');
}
$("#submit").click(function(){
$.ajax({
url:'feedback.php',
method:'POST',
data:{
selectedRoomName: selectedRoomName,
experience: experience,
rating: rating
},
success: function(){
alert(experience);
}
});
});
});
</script>
</html> Комментарии:
1. Удалить
error_reporting(0);из вашего кода
Ответ №1:
Подвиньте
var selectedRoomName=$("#selectedRoomName").val();
var experience=$("#experience").val();
внутри вашего метода .click ().
Комментарии:
1. О, большое спасибо, решил проблему! Действительно благодарен. Почему это происходило? var был глобально объявлен правильным?
2. Нет, вы не назначали var при запуске события отправки, он был назначен во время инициализации сценария, и в этот момент значение будет пустым. Затем, когда пользователь заполняет текстовую область и отправляет ее, он собирал ранее пустые значения.