El formulario importa datos de JSON (La ruta aff_json y aff_import es una ruta PH)

 <form id="import" action="{{ path('aff_import') }}" method="post" name="aff"> <input type="hidden" data-action="{{ path('aff_json') }}" id="aff_json"> <select name="aff[code]" data-placeholder="{{ 'affaire' | trans | capitalize }}" required></select> <button id="importAff" type="submit">{{ 'import' | trans | capitalize }}</button> </form>

Y el js para este formulario:

 const onClickImport = function () { let url = $('#aff').attr('data-action'); $("#import .select2-ajax").select2({ dropdownParent: $('#import'), // some datas processResults: function (data) { return { results: $.map(data, function (item) { return { text: item.code, } }), } } } }).trigger('change'); modalImportAffaire.show(); }

Así que ahora, tengo un cuadro de selección con el valor diferente.

Y ahora lo que quiero es cambiar por datalist con proponer el mismo valor diferente; estoy tratando de hacer eso:

 <form id="import" action="{{ path('aff_import') }}" method="post" name="aff"> <label>Choose a browser from this list: <input list="browsers" data-action="{{ path('affaire_qp_json') }}" id="affaire_qp"> <datalist id="browsers" class="select2-ajax" style="width: 20%" data-placeholder="{{ 'affaire' | trans | capitalize }}" required></datalist> </form>

Al principio no tengo nada en mi texto de entrada:

El problema está aquí, es cuando elijo y hago clic en el cuadro de selección:

En mi entrada, tengo el valor seleccionado en el cuadro de selección:

El problema es que tengo una entrada con un cuadro de selección (con valores) y ya quiero todo en el texto de entrada y no necesito seleccionar en el cuadro de selección, ¿alguien puede explicar por qué?