1

tengo un problema al darle click al calendario no lo muestra.

<script type="text/javascript">
    $(function () {
        $('#datetimepicker6').datetimepicker();
        $('#datetimepicker7').datetimepicker({
            useCurrent: false //Important! See issue #1075
        });
        $("#datetimepicker6").on("dp.change", function (e) {
            $('#datetimepicker7').data("DateTimePicker").minDate(e.date);
        });
        $("#datetimepicker7").on("dp.change", function (e) {
            $('#datetimepicker6').data("DateTimePicker").maxDate(e.date);
        });
    });
</script>
<!DOCTYPE html>
<html>
    <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Prueba</title>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"/>
<link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.47/css/bootstrap-datetimepicker.min.css" rel="stylesheet">

    
  </head>
  <body>


  <div class="container">
    <h1>DMG</h1>
    <h3>Sub</h3>
    <br />
    <form method="post">
      <div class="form-row">
        <div class="col-md-12 mb-3">
          <div class="container">

              <div class='col-md-5'>
                  <div class="form-group">
                      <div class='input-group date' id='datetimepicker6'>
                          <input type='text' class="form-control" value="hjasdb" />
                          <span class="input-group-addon">
                              <span class="glyphicon glyphicon-calendar"></span>
                          </span>
                      </div>
                  </div>
              </div>

              <div class='col-md-5'>
                  <div class="form-group">
                      <div class='input-group date' id='datetimepicker7'>
                          <input type='text' class="form-control" />
                          <span class="input-group-addon">
                              <span class="glyphicon glyphicon-calendar"></span>
                          </span>
                      </div>
                  </div>
              </div>
              <button class="btn btn-danger" onclick=""><i class="fa fa-file-pdf"></i> Exportar PDF</button>

          </div>
        </div>
      </div>
    </form>

    

  </div>
  
   <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
  
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.47/js/bootstrap-datetimepicker.min.js"></script>

  
  </body>
</html>

Espero que me puedan ayudar.

Gracias

2

1 respuesta 1

1

Debes incluir las librerias de moment.js y de bootstrap-datetimepicker.js si quieres que funcione. Te dejo un ejemplo:

    $(function () {
        $('#datetimepicker6').datetimepicker();
        $('#datetimepicker7').datetimepicker({
            useCurrent: false //Important! See issue #1075
        });
        $("#datetimepicker6").on("dp.change", function (e) {
            $('#datetimepicker7').data("DateTimePicker").minDate(e.date);
        });
        $("#datetimepicker7").on("dp.change", function (e) {
            $('#datetimepicker6').data("DateTimePicker").maxDate(e.date);
        });
    });
<!DOCTYPE html>
<html>
    <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Prueba</title>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"/>

    
  </head>
  <body>


  <div class="container">
    <h1>DMG</h1>
    <h3>Sub</h3>
    <br />
    <form method="post">
      <div class="form-row">
        <div class="col-md-12 mb-3">
          <div class="container">

              <div class='col-md-5'>
                  <div class="form-group">
                      <div class='input-group date' id='datetimepicker6'>
                          <input type='text' class="form-control" value="hjasdb" />
                          <span class="input-group-addon">
                              <span class="glyphicon glyphicon-calendar"></span>
                          </span>
                      </div>
                  </div>
              </div>

              <div class='col-md-5'>
                  <div class="form-group">
                      <div class='input-group date' id='datetimepicker7'>
                          <input type='text' class="form-control" />
                          <span class="input-group-addon">
                              <span class="glyphicon glyphicon-calendar"></span>
                          </span>
                      </div>
                  </div>
              </div>
              <button class="btn btn-danger" onclick=""><i class="fa fa-file-pdf"></i> Exportar PDF</button>

          </div>
        </div>
      </div>
    </form>

    

  </div>
  
   <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.15.1/moment.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>

 <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.47/js/bootstrap-datetimepicker.min.js"></script>
  

  
  
  </body>
</html>

8
  • Hola tengo una duda, en que parte de mi codigo pongo la funcion js?.
    – Javier fr
    Commented el 6 jul. 2018 a las 18:33
  • ya puse los dos scripts que pusiste pero sigue sin funcionar
    – Javier fr
    Commented el 6 jul. 2018 a las 18:35
  • Como ves aqui si funciona. El javascript lo puedes poner donde sea, solo tienes que agregar el tag <script>
    – alanfcm
    Commented el 6 jul. 2018 a las 18:39
  • ya lo hise y no jala
    – Javier fr
    Commented el 6 jul. 2018 a las 18:41
  • Entonces ponlo despues que agregas todos los otros scripts
    – alanfcm
    Commented el 6 jul. 2018 a las 18:42

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.