我有这样的代码,它的作用是知道有多少人在我输入表单的那一天被预订。查询运行良好,并返回预期的结果。问题是,我想在选择的一个小时附近显示这个结果,所以它不会显示给我。如果id的div结果日期或从选择的不同的时间选项,我看到的结果。如何在选项中查看查询结果?
这是check_availablity.php的文件。
require('config.php');
sleep(1);
$data = $_POST['data'];
$result = $connexion->query(
'SELECT persones FROM reservas where data = \''.$data.'\' ORDER by hora ASC'
);
if ($result->num_rows > 0) {
foreach ($result as $hores){
echo $hores['persones'].' llocs disponibles.';
}
}
else{
echo 'Esta tot reservat';
}
<!DOCTYPE HTML>
<html>
<head>
<title>Rem la Ràpita</title>
<link rel="icon" type="image/png" href="../images/favicon.png" sizes="32x32"/>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<!--Comprovar la disponibilitat d'horari-->
<script src="https://code.jquery.com/jquery-3.2.1.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('#data').on('blur', function(){
var data = $(this).val();
var dataString = 'data='+data;
$.ajax({
type: "POST",
url: "check_availablity.php",
data: dataString,
success: function(data) {
$('#result-data').fadeIn(1000).html(data);
}
});
});
});
</script>
</head>
<body>
<div class="container-login">
<div class="wrap-login" style="width: 1000px">
<!--<form class="login-form validate-form" action="bd/reservar.php" method="post">-->
<form class="login-form validate-form" action="bd/reservar.php" method="post">
<span class="login-form-title"></span>
<div class="row">
<div class="wrap-input100 col-xs-6 espai-davant-text" data-validate = "Nom incorrecte">
<input class="input100" type="text" id="nom" name="nom" placeholder="">
<span class="focus-efecto"></span>
</div>
<div class="wrap-input100 col-xs-6 espai-davant-text" data-validate = "Email incorrecto">
<input class="input100" type="text" id="apellidos" name="apellidos" placeholder="" >
<span class="focus-efecto"></span>
</div>
<div class="wrap-input100" style="width:100%" data-validate = "Email incorrecto">
<input class="input100" type="text" id="email" name="email" placeholder="">
<span class="focus-efecto"></span>
</div>
<div class="wrap-input100 col-xs-6 espai-davant-text" data-validate="Telefon incorrecto">
<input class="input100" type="text" id="telefon" name="telefon" placeholder="">
<span class="focus-efecto"></span>
</div>
<div class="wrap-input100 col-xs-6 espai-davant-text" data-validate="Persones incorrecto">
<input class="input100" type="number" id="persones" name="persones" placeholder="">
<span class="focus-efecto"></span>
</div>
<div class="wrap-input100" style="width:100%" data-validate="Data incorrecto">
<input class="input100" type="date" id="data" name="data" placeholder="Fecha">
<span class="focus-efecto"></span>
</div>
<div class="wrap-input100" style="width:100%" data-validate="Hora incorrecto">
<select name="hora" id="hora" class="input100">
<option disabled selected></option>
<option value="12:00">12:00</option><div id="result-data"></div>
<option value="12:30">12:30</option>
<option value="13:00">13:00</option>
<option value="13:30">13:30</option>
<option value="14:00">14:00</option>
<option value="20:00">20:00</option>
<option value="20:30">20:30</option>
<option value="21:00">21:00</option>
<option value="21:30">21:30</option>
<option value="22:00">22:00</option>
<option value="22:30">22:30</option>
</select>
<span class="focus-efecto"></span>
</div>
<div class="container-login-form-btn">
<div class="wrap-login-form-btn">
<div class="login-form-bgbtn"></div>
<button type="submit" name="submit" class="login-form-btn">RESERVAR</button>
</div>
</div>
</div>
</form>
</div>
</div>
</body>
</html>
发布于 2022-09-27 13:58:33
看起来您正在尝试使用ajax来更改所选的选项?那是行不通的。并且该选项上的div标记也不能工作。
select通常是由操作系统设计的,要更改其中的内容并不容易。使用ajax显示选项旁边的内容是没有意义的。
如果您的目标是在用户打开下拉列表之前更新下拉列表,那么使用ajax替换完整的select元素,包括选项。
https://stackoverflow.com/questions/73870858
复制相似问题