Estoy tratando de agregar un selector de tiempo a mi página usando Bootstrap 5, por alguna razón, el calendario no se carga, por lo que no puedo elegir ninguna fecha. No sé si he hecho algo mal o el plugin no es compatible con la última versión de bootstrap.
Si hace clic en "iniciar demostración modal", verá el campo de entrada de fecha y el selector de fecha no funciona allí.
Este es el código para el campo de fecha de entrada:
<div class="col-12"> <label for="date" class="col-sm-1 col-form-label">Date</label> <div class="input-group date" id="datepicker"> <input type="text" class="form-control"> <span class="input-group-append"> <span class="input-group-text bg-white d-block"> <i class="fa fa-calendar"></i> </span> </span> </div> </div>JS (truncado):
<script type="text/javascript"> $(document).ready(function () { $('#datepicker').datepicker(); ... }); </script> También intenté usar $('.datepicker').datepicker(); de acuerdo con los documentos bootstrap-datepicker pero nada cambió.
fuente de desbordamiento de pila
Debe colocar bootstrap-datepicker.min.js después de jquery.js. De alguna manera comete errores debido a eso.
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.9.0/js/bootstrap-datepicker.min.js"></script>Incluya a continuación CSS y js en su archivo
Referencia: https://cdnjs.com/libraries/bootstrap-datepicker
<!-- Bootstrap datepicker CSS --> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.9.0/css/bootstrap-datepicker.min.css"/> <!-- Bootstrap datepicker JS--> <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.9.0/js/bootstrap-datepicker.min.js"></script>Para un estilo personalizado, eche un vistazo al siguiente enlace