You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
 

56 lines
1.9 KiB

{% extends 'base.html' %}
{% block header %}
<h2>{% block title %}Hacer una nueva reserva{% endblock title %}</h2>
{% endblock header %}
{% block content %}
<form action="/inserta/{{ diaelegido }}" method="post">
<!--
<div class="field">
<label for="nombre">Nombre:</label>
<input type="text" id="nombre" name="nombre" required class="form-control"><br>
</div>
-->
<div class="field">
<!-- <label for="fecha">Fecha:</label>
<input type="date" id="fecha" name="fecha" required class="form-control" min="{{ diaelegido }}", max="{{ diaelegido }}", value={{ diaelegido }}""><br> -->
<textarea class="textarea" rows="1">Fecha de la reserva: {{ diaelegido }} </textarea>
</div>
<div class="field">
<label for="hora">Hora:</label>
<input class="input" type="time" id="hora" name="hora" required class="form-control" list="horas-permitidas"><br>
</div>
<datalist id="horas-permitidas">
<option value="08:00"></option>
<option value="09:00"></option>
<option value="10:00"></option>
<option value="11:00"></option>
<option value="12:00"></option>
<option value="13:00"></option>
<option value="14:00"></option>
<option value="15:00"></option>
<option value="16:00"></option>
<option value="17:00"></option>
</datalist>
<div class="form-group">
<button type="submit" class="button is-medium">Reservar</button>
</div>
</form>
<script>
document.getElementById('hora').addEventListener('input', function() {
var val = this.value;
var options = document.getElementById('horas-permitidas').querySelectorAll('option');
var match = Array.from(options).find(function(option) {
return option.value === val;
});
if (!match) {
this.value = '';
}
});
</script>
{% endblock content %}