Skip to main content
se añadieron 187 caracteres en el cuerpo
Origen Enlace
omaza1990
  • 2.8k
  • 36
  • 103
  • 163
<!DOCTYPE html>
<html lang="es">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
        <title>Reservar</title>
        <link rel="stylesheet" href="css/estilos_reservar.css">
        <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.css">
        <script type="text/javascript" src="js/calculoNoches.js"></script>
        <script src="http://momentjs.com/downloads/moment.min.js"></script>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
        <script src="https://code.jquery.com/jquery-1.12.4.js"></script>
        <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
        <script type="text/javascript">
        $(function() {
            var defaults = {
                closeText: 'Cerrar',
                prevText: '<Anterior',
                nextText: 'Siguiente>',
                currentText: 'Hoy',
                monthNames: ['Enero', 'Febrero', 'Marzo', 'Abril', 'Mayo', 'Junio', 'Julio', 'Agosto', 'Septiembre', 'Octubre', 'Noviembre', 'Diciembre'],
                monthNamesShort: ['Ene','Feb','Mar','Abr', 'May','Jun','Jul','Ago','Sep', 'Oct','Nov','Dic'],
                dayNames: ['Domingo', 'Lunes', 'Martes', 'Miércoles', 'Jueves', 'Viernes', 'Sábado'],
                dayNamesShort: ['Dom','Lun','Mar','Mié','Juv','Vie','Sáb'],
                dayNamesMin: ['Do','Lu','Ma','Mi','Ju','Vi','Sá'],
                weekHeader: 'Sm',
                dateFormat: 'yy/mm/dd',
                firstDay: 1,
                isRTL: false,
                showMonthAfterYear: false,
                yearSuffix: ''
            };
            
            $.datepicker.setDefaults(defaults);
            $("#check_in").datepicker({
                //The value "0" means today (0 days from today)
                minDate: 0,
                onSelect: function(dateStr) {
                    //datepicker("setDate", new Date()); //día actual.
                    var minDate = $(this).datepicker('getDate');
                    if (minDate) { 
                        minDate.setDate(minDate.getDate() + 1);
                    }
                    $('#check_out').datepicker('setDate', minDate).
                    datepicker('option', 'minDate', minDate); //día siguiente al actual en "check_out".
                }
            });

            $('#check_out').datepicker().on("input click", function(e) {
                console.log("Fecha salida cambiada: ", e.target.value);
            });
        });
        </script>
    </head>
    <body>
        <form action="<?php echo $_SERVER['PHP_SELF'];?>" name="mibusqueda" id="mibusqueda" method="POST" class="form_buscar">
            <h2>RESERVAR</h2>
            <label for="check_in">Entrada:</label>
            <input type="text" placeholder="Fecha de entrada" name="check_in" id="check_in" value="<?php if(isset($_POST['check_in'])){ echo $_POST['check_in']; }?>">
            <label for="check_out">Salida:</label>
            <input type="text" placeholder="Fecha de salida" name="check_out" id="check_out" onchange="calculoNoches();" value="<?php if(isset($_POST['check_out'])){ echo $_POST['check_out']; }?>">
            <p id="calculoNoches"></p><br/>
            <div align="center">
                <input type="submit" value="Buscar" name="buscar" id="buscar"><br/>
            </div>
        </form>
    </body>
</html>

1) ¿Por qué no se deshabilitan los días anteriores al¿Cómo controlo que inserte antes la fecha de entrada que la fecha de salida? Debido a que si escribe como fecha de salida (el día actual?) no debe permitirlo...

<!DOCTYPE html>
<html lang="es">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
        <title>Reservar</title>
        <link rel="stylesheet" href="css/estilos_reservar.css">
        <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.css">
        <script type="text/javascript" src="js/calculoNoches.js"></script>
        <script src="http://momentjs.com/downloads/moment.min.js"></script>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
        <script src="https://code.jquery.com/jquery-1.12.4.js"></script>
        <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
        <script type="text/javascript">
        $(function() {
            var defaults = {
                closeText: 'Cerrar',
                prevText: '<Anterior',
                nextText: 'Siguiente>',
                currentText: 'Hoy',
                monthNames: ['Enero', 'Febrero', 'Marzo', 'Abril', 'Mayo', 'Junio', 'Julio', 'Agosto', 'Septiembre', 'Octubre', 'Noviembre', 'Diciembre'],
                monthNamesShort: ['Ene','Feb','Mar','Abr', 'May','Jun','Jul','Ago','Sep', 'Oct','Nov','Dic'],
                dayNames: ['Domingo', 'Lunes', 'Martes', 'Miércoles', 'Jueves', 'Viernes', 'Sábado'],
                dayNamesShort: ['Dom','Lun','Mar','Mié','Juv','Vie','Sáb'],
                dayNamesMin: ['Do','Lu','Ma','Mi','Ju','Vi','Sá'],
                weekHeader: 'Sm',
                dateFormat: 'yy/mm/dd',
                firstDay: 1,
                isRTL: false,
                showMonthAfterYear: false,
                yearSuffix: ''
            };
            
            $.datepicker.setDefaults(defaults);
            $("#check_in").datepicker({
                onSelect: function(dateStr) {
                    //datepicker("setDate", new Date()); //día actual.
                    var minDate = $(this).datepicker('getDate');
                    if (minDate) { 
                        minDate.setDate(minDate.getDate() + 1);
                    }
                    $('#check_out').datepicker('setDate', minDate).
                    datepicker('option', 'minDate', minDate); //día siguiente al actual en "check_out".
                }
            });

            $('#check_out').datepicker().on("input click", function(e) {
                console.log("Fecha salida cambiada: ", e.target.value);
            });
        });
        </script>
    </head>
    <body>
        <form action="<?php echo $_SERVER['PHP_SELF'];?>" name="mibusqueda" id="mibusqueda" method="POST" class="form_buscar">
            <h2>RESERVAR</h2>
            <label for="check_in">Entrada:</label>
            <input type="text" placeholder="Fecha de entrada" name="check_in" id="check_in" value="<?php if(isset($_POST['check_in'])){ echo $_POST['check_in']; }?>">
            <label for="check_out">Salida:</label>
            <input type="text" placeholder="Fecha de salida" name="check_out" id="check_out" onchange="calculoNoches();" value="<?php if(isset($_POST['check_out'])){ echo $_POST['check_out']; }?>">
            <p id="calculoNoches"></p><br/>
            <div align="center">
                <input type="submit" value="Buscar" name="buscar" id="buscar"><br/>
            </div>
        </form>
    </body>
</html>

1) ¿Por qué no se deshabilitan los días anteriores al día actual?

<!DOCTYPE html>
<html lang="es">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
        <title>Reservar</title>
        <link rel="stylesheet" href="css/estilos_reservar.css">
        <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.css">
        <script type="text/javascript" src="js/calculoNoches.js"></script>
        <script src="http://momentjs.com/downloads/moment.min.js"></script>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
        <script src="https://code.jquery.com/jquery-1.12.4.js"></script>
        <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
        <script type="text/javascript">
        $(function() {
            var defaults = {
                closeText: 'Cerrar',
                prevText: '<Anterior',
                nextText: 'Siguiente>',
                currentText: 'Hoy',
                monthNames: ['Enero', 'Febrero', 'Marzo', 'Abril', 'Mayo', 'Junio', 'Julio', 'Agosto', 'Septiembre', 'Octubre', 'Noviembre', 'Diciembre'],
                monthNamesShort: ['Ene','Feb','Mar','Abr', 'May','Jun','Jul','Ago','Sep', 'Oct','Nov','Dic'],
                dayNames: ['Domingo', 'Lunes', 'Martes', 'Miércoles', 'Jueves', 'Viernes', 'Sábado'],
                dayNamesShort: ['Dom','Lun','Mar','Mié','Juv','Vie','Sáb'],
                dayNamesMin: ['Do','Lu','Ma','Mi','Ju','Vi','Sá'],
                weekHeader: 'Sm',
                dateFormat: 'yy/mm/dd',
                firstDay: 1,
                isRTL: false,
                showMonthAfterYear: false,
                yearSuffix: ''
            };
            
            $.datepicker.setDefaults(defaults);
            $("#check_in").datepicker({
                //The value "0" means today (0 days from today)
                minDate: 0,
                onSelect: function(dateStr) {
                    //datepicker("setDate", new Date()); //día actual.
                    var minDate = $(this).datepicker('getDate');
                    if (minDate) { 
                        minDate.setDate(minDate.getDate() + 1);
                    }
                    $('#check_out').datepicker('setDate', minDate).
                    datepicker('option', 'minDate', minDate); //día siguiente al actual en "check_out".
                }
            });

            $('#check_out').datepicker().on("input click", function(e) {
                console.log("Fecha salida cambiada: ", e.target.value);
            });
        });
        </script>
    </head>
    <body>
        <form action="<?php echo $_SERVER['PHP_SELF'];?>" name="mibusqueda" id="mibusqueda" method="POST" class="form_buscar">
            <h2>RESERVAR</h2>
            <label for="check_in">Entrada:</label>
            <input type="text" placeholder="Fecha de entrada" name="check_in" id="check_in" value="<?php if(isset($_POST['check_in'])){ echo $_POST['check_in']; }?>">
            <label for="check_out">Salida:</label>
            <input type="text" placeholder="Fecha de salida" name="check_out" id="check_out" onchange="calculoNoches();" value="<?php if(isset($_POST['check_out'])){ echo $_POST['check_out']; }?>">
            <p id="calculoNoches"></p><br/>
            <div align="center">
                <input type="submit" value="Buscar" name="buscar" id="buscar"><br/>
            </div>
        </form>
    </body>
</html>

1) ¿Cómo controlo que inserte antes la fecha de entrada que la fecha de salida? Debido a que si escribe como fecha de salida (el día actual) no debe permitirlo...

se añadieron 550 caracteres en el cuerpo
Origen Enlace
omaza1990
  • 2.8k
  • 36
  • 103
  • 163

ErroresError:

1) ¿Por qué en la fecha de entrada me deja elegir cualquier fecha, aunque el día sea del pasado? Me selecciona correctamente en un color diferente el día actual, perono se deshabilitan los días anteriores no se me bloquean.al día actual?

Errores:

1) ¿Por qué en la fecha de entrada me deja elegir cualquier fecha, aunque el día sea del pasado? Me selecciona correctamente en un color diferente el día actual, pero los días anteriores no se me bloquean.

Error:

1) ¿Por qué no se deshabilitan los días anteriores al día actual?

se añadieron 550 caracteres en el cuerpo
Origen Enlace
omaza1990
  • 2.8k
  • 36
  • 103
  • 163

Función calculoNoches():

function calculoNoches(){
    var check_in = document.getElementById("check_in").value;
    var check_out = document.getElementById("check_out").value;
    var f1 = moment(check_in);
    var f2 = moment(check_out);
    var noches = f2.diff(f1, "days");
    //Comprobacion del numero de noches.
    if(noches<=0){
        document.getElementById("calculoNoches").innerHTML="";
    }else{
        document.getElementById("calculoNoches").innerHTML="Estancia de "+noches+" noches.";
    }
}

Errores:

Errores:

Función calculoNoches():

function calculoNoches(){
    var check_in = document.getElementById("check_in").value;
    var check_out = document.getElementById("check_out").value;
    var f1 = moment(check_in);
    var f2 = moment(check_out);
    var noches = f2.diff(f1, "days");
    //Comprobacion del numero de noches.
    if(noches<=0){
        document.getElementById("calculoNoches").innerHTML="";
    }else{
        document.getElementById("calculoNoches").innerHTML="Estancia de "+noches+" noches.";
    }
}

Errores:

Origen Enlace
omaza1990
  • 2.8k
  • 36
  • 103
  • 163
Loading