Estoy tratando de entender quién trabaja con AJAX Select2
Tengo esto:
$(document).ready(function() { $('.js-example-basic-single').select2(); }); <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <link href="https://cdn.jsdelivr.net/npm/select2@4.1.0-beta.1/dist/css/select2.min.css" rel="stylesheet" /> <script src="https://cdn.jsdelivr.net/npm/select2@4.1.0-beta.1/dist/js/select2.min.js"></script> <form> <select class="js-example-basic-single" name="state"> <option value="AL">Alabama</option> <option value="WY">Wyoming</option> </select> <button id="importerAffaire" type="submit" >Importer</button> </form>Entonces, lo que quiero, cuando pongo otro valor en la lista, quiero mostrar otro botón:
<button id="creerAffaire" type="submit" >Create</button>Y lo más importante es tener en cuenta el nuevo valor en la lista o de otra manera porque lo que quiero es que si el valor no existe, deba insertarse en la base de datos.
Entonces, ¿puedes explicarme la mejor manera? gracias
Si entiendo correctamente, desea que sea posible agregar una nueva entrada a la selección y, en caso de que se agregue una nueva entrada, enviarla a su backend a través de AJAX, para que pueda actualizar los valores de sus opciones en DB. Siguiendo la documentación de select2 : https://select2.org/tagging
$(document).ready(function() { $('.js-example-basic-single').select2({ tags: true, createTag: createEntry }); $("form").submit((e) => e.preventDefault()) $("select").change(handleSubmit) }); function createEntry(params) { const term = $.trim(params.term); if (term === '') { return null; } return { id: term, text: term, newTag: true // add additional parameters } } function handleSubmit(e) { console.log("SUBMITTING VALUE", e.target.value) // SEND THE SELECTED OPTION TO YOUR BACKEND, THERE YOU PERFORM THE CHECK IF THE SELECTED VALUE IS A NEW VALUE OR NOT } <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <link href="https://cdn.jsdelivr.net/npm/select2@4.1.0-beta.1/dist/css/select2.min.css" rel="stylesheet" /> <script src="https://cdn.jsdelivr.net/npm/select2@4.1.0-beta.1/dist/js/select2.min.js"></script> <form> <select class="js-example-basic-single" name="state"> <option value="AL">Alabama</option> <option value="WY">Wyoming</option> </select> </form>