entre Desarrolladores

Recibe ayuda de expertos

Registrate y pregunta

Es gratis y fácil

Recibe respuestas

Respuestas, votos y comentarios

Vota y selecciona respuestas

Recibe puntos, vota y da la solución

Pregunta

3votos

Ayuda con date picker de bootstrap, no lo consigo

Hola que tal comunidad, tengo un problema ha la hora de utilizar un framework de jQuery date bootstrap.

Dicho problema consiste en que no consigo cargar unas fechas que obtengo tras una consulta en la BD. Me he fijado que el plugin que menciono tiene una caja de texto el cual se carga con una fecha tras pinchar sobre una fecha, lo cual deduje que si consiguiera cargar las fechas en este input tras una consulta podría reflejarse en el calendario, pero al parecer no funciona como tengo pensado.

pd: He de comentar y me he documentado que para fijar una fecha se hace mediante el atributo setDate pasandole las fechas a mano o creando un objeto tipo date, pero como digo de ningún tipo consigo el resultado.

pd: Segun leí en una duda de alguien vi que no erais muy partidarios de utilizar frameworks, y lo entiendo pero en la empresa que estoy se me pide este tipo de plugin y no consigo finalizar el proyecto con esta modificación que se me pide. Bueno sin mas rodeos os dejo el código:

PHP:

<?php

try{
    //Creamos la conexion con la bd
    $conexion = new PDO('mysql:host=hl115.dinaserver.com;dbname=db', 'nombre', 'pass'); 
    //Indicamos que haremos uso de la condificacion utf8
    $conexion->exec("SET NAMES 'utf8'");
    //Despues creamos la consulta para actualizar los datos en la BD
    $consulta = "SELECT fecha FROM  altaFichas WHERE usuario='PascualMarti';";
    $consulta = $conexion->prepare($consulta);

    $fe = "";
    if($consulta->execute()){
        while($fila = $consulta->fetch()){
            $fecha  = $fila['fecha'];
            $ArrayFecha = explode('-', $fecha);
            $fecha = $ArrayFecha[0] ."/".$ArrayFecha[1] ."/".$ArrayFecha[2];
            $fe .= $fecha.",";
        }  
        echo "<input type='hidden' name='fe' id='fec' value='".$fe."'>";

    }else{
        $mensage = "Error, al intentar mostrar los datos.";
    }
    //Cerramos la conexión
    $conexion = null;

}catch(Exception $e){
    echo "Error en la conexión";
}

?>

Y ahora el HTML:

<html>
    <head>
        <title>prueba cargar fechas en calendario</title>
        <script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
        <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
        <script src="http://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.3.0/js/bootstrap-datepicker.js"></script>
        <link href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet" type="text/css">
        <link href="http://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.3.0/css/datepicker.css" rel="stylesheet" type="text/css">
        <script type="text/javascript">
            $('#sandbox-container .input-group.date').datepicker({
                 $("#sandbox-container .input-group.date").val($("#fe").attr("value"));
            });
        </script>
    </head>  
    <body>
        <div class="input-group date">
          <input type="text" class="form-control"><span class="input-group-addon"><i class="glyphicon glyphicon-th"></i></span>
        </div>
    </body>
</html>

Un saludo de antemano!

2 Respuestas

2votos

Leonardo-Tadei Puntos227320

Hola Pabeni,

creo que tu problema está en que querés asignar varias fechas, cuando según la especificación HTML, los INPUT de tipo DATE solo soportan una fecha como valor default.

Si tu idea es que del calendario solo se puedan seleccionar algunas fechas válidas de entre todas las del mes, tendrás que combinar algún componente que permita asignar fechas válidas y se relacione con el INPUT para poner la selecionada... es decir, un calendario más pontente que el pensado para los INPUT de tipo DATE

Saludos!

2votos

jonatancastro1 Puntos3130

Yo pienso que el error esta aquí:

 $('#sandbox-container .input-group.date').datepicker({
         //estas asignando el valor a un div de hecho creo que los div no tienen .val();
         //$("#sandbox-container .input-group.date").val($("#fec").attr("value"));
         //cambialo por:
           $('#sandbox-container .input-group.date input[type="text"]').val($('#fec').val());
 });

así el selector de jQuery apunta al input dentro del plugin.

Saludos.

Por favor, accede o regístrate para responder a esta pregunta.

Otras Preguntas y Respuestas


...

Bienvenido a entre Desarrolladores, donde puedes realizar preguntas y recibir respuestas de otros miembros de la comunidad.

Conecta