Javascript 选择日期时如何更新datetimepicker？
我正在使用xdsoft的datetimepicker：允许用户选择预订日期和时间 我在数据库中有一个表“fechas”，用于存储预订日期的信息。例如，日期为2020/04/28的预订时间为晚上7点 在这个特定的datetimepicker中，它们有一个函数“setOptions”，它接受一个“options”数组，这对于存储可用的日期非常有用，然后调用“allowTimes”传递日期数组 目前，我可以更改可用小时数，但它们显示的是以前选定的日期，而不是各自的日期 当用户单击submit时，datetimepicker下面会显示可用的小时数，但是，我想做的是在用户每次单击新日期时更新可用的小时数 这是我正在处理的文件 test.phpJavascript 选择日期时如何更新datetimepicker？,javascript,php,html,jquery,Javascript,Php,Html,Jquery,我正在使用xdsoft的datetimepicker：允许用户选择预订日期和时间 我在数据库中有一个表“fechas”，用于存储预订日期的信息。例如，日期为2020/04/28的预订时间为晚上7点 在这个特定的datetimepicker中，它们有一个函数“setOptions”，它接受一个“options”数组，这对于存储可用的日期非常有用，然后调用“allowTimes”传递日期数组 目前，我可以更改可用小时数，但它们显示的是以前选定的日期，而不是各自的日期 当用户单击submit时，dat
<!DOCTYPE html>
<html>
<head>
<title>Test</title>
</head>
<body>
<form name="test-form" id="test-form" method="POST">
<div id="test-container" style="margin-top:100px;margin-left:100px;">
<p>Seleccione la fecha para verificar horarios</p>
<input type="text" name="test_day" class="test_day" id="test_day" placeholder="15 / 08 / 2018">
<input type="submit" id="test_submit" name="test_submit" value="Submit">
<div id="test_response" name="test_response"></div>
</div>
</form>
</body>
<link rel="stylesheet" type="text/css" href="datetimepicker/jquery.datetimepicker.css"/>
<script src="datetimepicker/jquery.js"></script>
<script src="datetimepicker/build/jquery.datetimepicker.full.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.4/lodash.min.js"></script>
<script src="test.js"></script>
</html>
<?php
if(isset($_POST['btn']))
{
require_once("includes/dbh.inc.php");
require_once("includes/conexion.inc.php");
$fecha = $_POST['fecha'];
$hora = $_POST['hora'];
$btn = $_POST['btn'];
if (empty($fecha) || empty($hora))
{
echo "emptyFields";
exit();
}
else {
$sql = "SELECT * FROM fechas where fecha=?";
$stmt = mysqli_stmt_init($con);
if(!mysqli_stmt_prepare($stmt,$sql))
{
echo "db-error";
exit();
}
else {
$fecha = strtotime($fecha);
$formattedDate = date('Y-m-d', $fecha);
mysqli_stmt_bind_param($stmt, "s", $formattedDate);
mysqli_stmt_execute($stmt);
$results = mysqli_stmt_get_result($stmt);
if ($row = mysqli_fetch_assoc($results))
{
$horas_ocupadas = $row['horas'];
echo $horas_ocupadas;
}
else{
echo "allDatesAvailable";
exit();
}
}
}
}
else
{
header("Location: ../test.php");
}
试验
赫拉里奥斯酒店
//Logica para la validacion y base de datos
var horas_disponibles = [];
$('#test_submit').click(function(e) {
e.preventDefault();
var fecha = $('#test_day').val();
var separados = fecha.split(" ");
var btn = $("#test_submit").val();
var respuesta = document.getElementById("test_response");
if(fecha)
{
$.ajax({
url: "test_fechas.php",
type: "POST",
data: {
'fecha' : separados[0],
'hora' : separados[1],
'btn' : btn
},
success: function(response) {
if(response)
{
if(response == "db-error")
{
respuesta.innerHTML = "<p>Error al conectarse a la base de datos</p>";
}
else if (response == "emptyFields")
{
respuesta.innerHTML = "<p>Faltan parametros</p>";
}
else if (response == "allDatesAvailable")
{
respuesta.innerHTML = "<p>Todas las fechas disponibles</p>";
}
else {
var db_ans = response.split(",");
var horas_normales = ["19:00", "19:30", "20:00","20:30"]; // Data 1 - frente a este comparamos
for (var i =0; i < horas_normales.length; i++)
{
var esIgual = false;
for (var j = 0; j < db_ans.length & !esIgual; j++)
{
if(horas_normales[i] == db_ans[j])
{
esIgual = true;
}
}
if(!esIgual)horas_disponibles.push(horas_normales[i]);
}
respuesta.innerHTML = "<p>Las horas disponibles son: " + horas_disponibles[0] + " " + horas_disponibles[1];
}
}
else {
respuesta.innerHTML = "<p>No hubo respuesta</p>";
}
}
});
}
});
$('#test_day').datetimepicker({
minDate: '-1970/01/01',
disabledWeekDays: [0,1,3,5,6],
onSelectDate: function(input, $input)
{
this.setOptions({
allowTimes: horas_disponibles
});
}
});
//Logica para la validacion y base de datos
var horas_争议=[]；
$（“#测试_提交”）。单击（函数（e）{
e、 预防默认值（）；
var fecha=$（'test#u day'）.val（）；
var separados=fecha.split（“”）；
var btn=$（“#测试_提交”）.val（）；
var respuesta=document.getElementById（“测试响应”）；
if（fecha）
{
$.ajax({
url:“test_fechas.php”，
类型：“POST”，
数据：{
“fecha”：separados[0]，
“hora”：separados[1]，
“btn”：btn
},
成功：功能（响应）{
如果（答复）
{
如果（响应=“数据库错误”）
{
respuesta.innerHTML=“Error al contarse a la base de datos”；
}
else if（响应==“清空字段”）
{
respuesta.innerHTML=“Faltan参数””；
}
else if（响应==“AllDateSavaailable”）
{
respuesta.innerHTML=“Todas las fechas disponibles”；
}
否则{
var db_ans=response.split（“，”）；
var horas_normales=[“19:00”、“19:30”、“20:00”、“20:30”]；//数据1-法语
对于（var i=0；i”；
}
}
});
}
});
$（“#测试日”）.datetimepicker({
minDate:“-1970/01/01”，
禁用工作日：[0,1,3,5,6]，
onSelectDate:函数（输入，$input）
{
此选项为.setOptions({
允许时间：horas_争议
});
}
});
<!DOCTYPE html>
<html>
<head>
<title>Test</title>
</head>
<body>
<form name="test-form" id="test-form" method="POST">
<div id="test-container" style="margin-top:100px;margin-left:100px;">
<p>Seleccione la fecha para verificar horarios</p>
<input type="text" name="test_day" class="test_day" id="test_day" placeholder="15 / 08 / 2018">
<input type="submit" id="test_submit" name="test_submit" value="Submit">
<div id="test_response" name="test_response"></div>
</div>
</form>
</body>
<link rel="stylesheet" type="text/css" href="datetimepicker/jquery.datetimepicker.css"/>
<script src="datetimepicker/jquery.js"></script>
<script src="datetimepicker/build/jquery.datetimepicker.full.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.4/lodash.min.js"></script>
<script src="test.js"></script>
</html>
<?php
if(isset($_POST['btn']))
{
require_once("includes/dbh.inc.php");
require_once("includes/conexion.inc.php");
$fecha = $_POST['fecha'];
$hora = $_POST['hora'];
$btn = $_POST['btn'];
if (empty($fecha) || empty($hora))
{
echo "emptyFields";
exit();
}
else {
$sql = "SELECT * FROM fechas where fecha=?";
$stmt = mysqli_stmt_init($con);
if(!mysqli_stmt_prepare($stmt,$sql))
{
echo "db-error";
exit();
}
else {
$fecha = strtotime($fecha);
$formattedDate = date('Y-m-d', $fecha);
mysqli_stmt_bind_param($stmt, "s", $formattedDate);
mysqli_stmt_execute($stmt);
$results = mysqli_stmt_get_result($stmt);
if ($row = mysqli_fetch_assoc($results))
{
$horas_ocupadas = $row['horas'];
echo $horas_ocupadas;
}
else{
echo "allDatesAvailable";
exit();
}
}
}
}
else
{
header("Location: ../test.php");
}
在确定新的可用时间列表后，它看起来像：
respuesta.innerHTML = "<p>Las horas disponibles son: " + horas_disponibles[0] + " " + horas_disponibles[1];
在确定新的可用时间列表后，它看起来像：
respuesta.innerHTML = "<p>Las horas disponibles son: " + horas_disponibles[0] + " " + horas_disponibles[1];