1

estoy intentando crear un select para traer datos de un crud para registrar ventas en un mysql pero como es una gran cantidad de datos necesito un select que tenga buscador y que sea dinámico para mostrar la cantidad de productos disponibles y además que todo ese select se pueda duplicar para agregar un nuevo producto en el mismo registro y la verdad no se como hacerlo ayuda por favor

<div class="mb-4">
   <label for="">Elige El Producto</label>
   <select class="form-select" aria-label="Default select example">
     <% for (let i = 0; i < producto.length; i++) { %>
     <option value=""><%= producto[i].nombre_producto%></option>
                                 <% } %>
   </select>
   <label for="">stock disponible </label>
   <input type="number" class="form-control" name="stockProd">
</div>
0

2 respuestas 2

1

Podrías usar Select2 te ofrece un cuadro de selección personalizable con soporte para búsqueda, etiquetado, conjuntos de datos remotos, desplazamiento infinito y muchas otras opciones muy utilizadas.

 // In your Javascript (external .js resource or <script> tag)
$(document).ready(function() {
    $('.js-example-basic-single').select2();
});
<select class="js-example-basic-single" name="state" style="width: 100%;">
<option value="AL">Alabama</option>
<option value="AL">Alaska</option>
<option value="AL">Vue</option>
<option value="AL">React</option>
<option value="WY">Wyoming</option>
  </select>

  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
  <link href="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/css/select2.min.css" rel="stylesheet" />
<script src="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/js/select2.min.js"></script>

Espero ayudarte con esto, cualquier cosa me comentas, Suerte!

4
  • pero como lo hago con una base de datos es que estuve leyendo la documentación pero gran parte es de php y no js y nesesitp traer los datos de mysql el 13 jul. 2021 a las 14:46
  • solo ingresas la lista que queres traer desde tu base dentro de la etiqueta select, sabes majear php?
    – Roy
    el 13 jul. 2021 a las 14:54
  • no php no lo manejo y cómo es un proyecto de ejs mucho menos pero con ejs logre que me muestre los datos pero no el buscador el 13 jul. 2021 a las 15:01
  • necesitaría ver tu código de php y como haces para insertar las cosas que traes desde la base de datos!
    – Roy
    el 13 jul. 2021 a las 15:04
0

Necesitas una librería, llamada Select2. Lo puedes usar con CDN:

<link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.6-rc.0/css/select2.min.css" rel="stylesheet" /> 

<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.6-rc.0/js/select2.min.js"></script>

Luego con el select que ya tienes en tu código:

$(document).ready(function() { 
 $('.form-select').select2(); 
});

Recuerda que Select2 necesita jquery

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>

Tu Respuesta

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

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