Yo estaba tratando de agregar Bootstrap selector de fecha en un área de entrada pero no he podido configurarlo:

He utilizado sus página de demostración para generar el código y lo he probado pero parece que me falta algo por Favor me ayude a solucionar este.

<!DOCTYPE html>
<html>
    <head>
        <title>Bootstrap</title>
        <meta name="viewport" content="width=device-width,initial-scale=1.0">
        <link href="../files/css/bootstrap.min.css" rel="stylesheet">
        <link href="http://eternicode.github.io/bootstrap-datepicker/bootstrap-datepicker/css/datepicker3.css" rel="stylesheet">

        <script src="../files/js/jquery.min.js"></script>
        <script src="../files/js/bootstrap.js"></script>
        <script src="http://eternicode.github.io/bootstrap-datepicker/bootstrap-datepicker/js/bootstrap-datepicker.js"></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>

<script>
    $('#sandbox-container .input-group.date').datepicker({
        format: "yyyy/mm/dd",
        startDate: "2012-01-01",
        endDate: "2015-01-01",
        todayBtn: "linked",
        autoclose: true,
        todayHighlight: true
        });
</script>
    </body>
</html>

También he intentado usar este enlaces para css y js:

  • Estoy usando Bootstrap 3
  • http://eternicode.github.io/bootstrap-datepicker/js/bootstrap-datepicker.js devuelve un error 404
  • Sí error en el enlace, pero no de trabajo, incluso después de corregir enlace para ver la actualización de
  • Has probado a incluir jquery bootstrap etc. dentro de la <head>. Parece que está tratando de llamar datepicker antes de incluir bootstrap biblioteca
  • Intentado Pero Sigue sin funcionar
  • ¿Qué es #sandbox-container ? Podría usted acaba de tratar de llamar datepicker como $('.form-control').datepicker({....?
  • Cómo poner tu datapicker método de la parte superior del cuerpo?

InformationsquelleAutor | 2014-03-04

3 Comentarios

  1. 6

    Mover el script de incluir etiquetas por encima de su guión, y quitar #sandbox-container de su selector – no existe. Funciona después de que (con la url correcta)…

    <script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
    <script src="//netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>
    <script src="http://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.3.0/js/bootstrap-datepicker.js"></script>
    <script>
        $('.input-group.date').datepicker({
            format: "yyyy/mm/dd",
            startDate: "2012-01-01",
            endDate: "2015-01-01",
            todayBtn: "linked",
            autoclose: true,
            todayHighlight: true
        });
    </script>

    jsfiddle ejemplo…

  2. 1

    Sólo tienes que quitar #sandbox-container Ya que no está presente en el código.

    Intente Esto:

    <!DOCTYPE html>
    <html>
        <head>
            <title>Bootstrap</title>
            <meta name="viewport" content="width=device-width,initial-scale=1.0">
            <link href="../files/css/bootstrap.min.css" rel="stylesheet">
            <link href="http://eternicode.github.io/bootstrap-datepicker/bootstrap-datepicker/css/datepicker3.css" rel="stylesheet">
    
            <script src="../files/js/jquery.min.js"></script>
            <script src="../files/js/bootstrap.js"></script>
            <script src="http://eternicode.github.io/bootstrap-datepicker/bootstrap-datepicker/js/bootstrap-datepicker.js"></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>
    
    <script>
        $('.input-group.date').datepicker({
            format: "yyyy/mm/dd",
            startDate: "2012-01-01",
            endDate: "2015-01-01",
            todayBtn: "linked",
            autoclose: true,
            todayHighlight: true
        });
    </script>
        </body>
    </html>
    • Lo que sobre el error 404 en el proceso de arranque-datepicker incluye?
    • Donde es el error 404 ?
  3. 0

    Se llama a la función de selector de fecha antes de llamar a jQuery, bootstrap.js & bootstrap-datepicker.js. Si usted depuración se obtendrá una excepción que indica «datepicker» no está definido.

    Lugar usted debe escribir :

        <script src="../files/js/jquery.min"></script>
        <script src="../files/js/bootstrap.js"></script>
        <script src="http://eternicode.github.io/bootstrap-datepicker/js/bootstrap-datepicker.js"></script>
    
        <script>
            $('#sandbox-container .input-group.date').datepicker({
                 format: "yyyy/mm/dd",
                 startDate: "2012-01-01",
                 endDate: "2015-01-01",
                 todayBtn: "linked",
                 autoclose: true,
                 todayHighlight: true
            });
        </script>
    • intentado pero no funciona.
    • Intentar una vez más, no se ve una parte de la respuesta antes.

Dejar respuesta

Please enter your comment!
Please enter your name here