Le principal problème est que je peux sélectionner du lundi au dimanche, mais je souhaite limiter mardi, jeudi, samedi et dimanche et sélectionner uniquement lundi, mercredi et vendredi. Voici le code que j'ai essayé mais je ne sais pas vraiment pourquoi il ne fonctionne pas :
Merci ! ! ! !
<form action="insertar_reserva_tarde.php" method="POST">
<label for="fecReserva">Día:</label>
<input type="date" name="fecReserva" id="fecReserva" min="2023-06-15" max="2023-07-15"required>
<br>
<label for="horIniReserva">Hora de inicio:</label>
<select name="horIniReserva" id="horIniReserva">
<option value="17">17:00</option>
<option value="18">18:00</option>
<option value="19">19:00</option>
<option value="20">20:00</option>
</select>
<br>
<label for="horFinReserva">Hora de fin:</label>
<select name="horFinReserva" id="horFinReserva">
<option value="18">18:00</option>
<option value="19">19:00</option>
<option value="20">20:00</option>
<option value="21">21:00</option>
</select>
<br>
<input type="hidden" name="pista" value="1">
<input type="hidden" name="idHorario" value="1">
<input type="submit" value="Reservar">
</form>
<?php
if(isset($_POST['fecReserva'])){
$date = strtotime($_POST['fecReserva']);
$dayOfWeek = date('N', $date); // obtiene el número del día de la semana (1 = lunes, 2 = martes, etc.)
if($dayOfWeek == 1 || $dayOfWeek == 3 || $dayOfWeek == 5){
echo "<p>La fecha seleccionada es el ".date('d/m/Y', $date)."</p>";
} else {
echo "<p>Sólo se permiten reservas en Lunes, Miércoles y Viernes.</p>";
}
}
?>
<script>// Everything except weekend days
const validate = dateString => {
const day = (new Date(dateString)).getDay();
if (day==2 || day==4 || day==6 || day==0 ) {
return false;
}
return true;
}
// Sets the value to '' in case of an invalid date
document.querySelector('input').onchange = evt => {
if (!validate(evt.target.value)) {
evt.target.value = '';
}
}
</script>
Le but est de sélectionner uniquement lundi, mercredi et vendredi
![[Web front-end] Démarrage rapide de Node.js](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
Votre problème semble être que vous attachez un écouteur à l'événement de changement de l'entrée, puis que vous renvoyez false à cet événement.
Si vous souhaitez sélectionner uniquement les jours impairs (en fonction des numéros de jours ECMAScript), la fonction renvoie simplement le résultat de
!!(dayNum % 2).La valeur de la date de type d'entrée est un horodatage au format AAAA-MM-JJ, elle sera analysée au format UTC, donc si vous utilisez
new Date(value), vous devez obtenir la date UTC.La logique est illustrée ci-dessous à travers l'affichage d'un message qui annule intentionnellement la soumission du formulaire pour afficher le succès et l'échec sans soumission.
Il existe de nombreuses autres façons d'obtenir le même résultat, par exemple vous pouvez utiliser valueAsDate au lieu d'appeler le constructeur Date. Vous pouvez également utiliser un tableau de dates autorisées ou non et le tester, etc.
window.onload = () => { // Related elements let form = document.getElementById('calendar'); let msg = document.getElementById('msg'); // The listener let checkDate = evt => { // Cancel submit if called from submit if (evt.type == 'submit') evt.preventDefault(); // Value parsed as UTC so get UTC day let day = new Date(form.theDate.value).getUTCDay(); // Check if day is valid let isValid = !!(day % 2); // Do stuff based on whether isValid is true or false // Show message based on selected day let days = ['Sunday','Monday','Tuesday','Wednesay','Thursday','Friday','Saturday'] msg.textContent = `Selected day is ${days[day]}, ` + `${isValid? 'pass.' : 'fail. Must be a Monday, Wednesday or Friday'}`; return isValid; } // Attach listeners - deal with form being submitted without setting a date form.addEventListener('change', checkDate); form.addEventListener('submit', checkDate); }#msg { color: #999999; font-family: sans-serif; }