0
398
Vistasbootstrap-multiselect crea un botón que no hace nada, en lugar de una lista desplegable de selección múltiple
Estoy tratando de usar bootstrap-multiselect para obtener un menú desplegable de selección múltiple en mi página web.
He creado un ejemplo mínimo, cuyo código se encuentra a continuación. Cuando ejecuto esto, obtengo un solo botón de aspecto 'antiguo' en la página, que no hace nada cuando se hace clic en él. Esperaba una de las multiselecciones desplegables bootstrap-multiselect.
<html> <head> <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous"> <script src="//ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script> <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.min.js" crossorigin="anonymous"> </script> <link href="http://cdn.rawgit.com/davidstutz/bootstrap-multiselect/master/dist/css/bootstrap-multiselect.css" rel="stylesheet" type="text/css" /> <script src="http://cdn.rawgit.com/davidstutz/bootstrap-multiselect/master/dist/js/bootstrap-multiselect.js" type="text/javascript"> </script> </head> <body> <select id="example-getting-started" multiple="multiple"> <option value="cheese">Cheese</option> <option value="tomatoes">Tomatoes</option> <option value="mozarella">Mozzarella</option> <option value="mushrooms">Mushrooms</option> <option value="pepperoni">Pepperoni</option> <option value="onions">Onions</option> </select> <script type="text/javascript"> $(document).ready(function () { $('#example-getting-started').multiselect(); }); </script> </body> </html>¿Qué estoy haciendo mal?
1 Respuestas
Responde la pregunta0
El problema está en las versiones que usas. Bootstrap es compatible hasta la versión 4 ya que tienen una guía de migración hasta v4
Y también, como puedo ver, la versión rawgit que usas no es la misma que la última versión.
Aquí está la versión que usa js y css de su página y funciona bien.
Si necesita que funcione con v5, puede usarlo así
$('#example-getting-started').multiselect({ buttonClass: 'form-select', templates: { button: '<button type="button" class="multiselect dropdown-toggle" data-bs-toggle="dropdown"><span class="multiselect-selected-text"></span></button>', } });Y también necesita usar la versión de paquete de bootstrap que contiene popper.js