Get 2024 Templates Mega Bundle!14 Bootstrap, Vue & React Templates + 3 Vector Sets
Get for 99$

Dropdown with input capabalities


Hi keenthemes,

Is there a way prefereblly in HTML5 to have a composed component, wich once click on it it show a dropdown of a list to select (like html <select> or Select2), and when you click one of the netries of the dropdown it will put that text inside the input box.

But still you can write inside the input box.

Basically it is a Input box (Free typing), with the capabilities of dropdow select and a arrow down in the right of the text box to toggle the dropdown.

I can make that using Metronic Menu dropdown, Input box and htmx... but I was hopping something like that exist in metronic, or a Hint to make it..

I remember once that I came accross something like this, but forget where...

Thank you


Text formatting options
Submit

Replies (4)


Ohhh man this Barrier of cropping the text, ...

Thank fully I always made CTRL + C of my text before submiting. anyway, here's the text without the html tag :

-----------------------------------------------------------------------------------
Hi keenthemes,

Is there a way prefereblly in HTML5 to have a composed component, wich once click on it it show a dropdown of a list to select (like html select or Select2), and when you click one of the netries of the dropdown it will put that text inside the input box.

But still you can write inside the input box.

Basically it is a Input box (Free typing), with the capabilities of dropdow select and a arrow down in the right of the text box to toggle the dropdown.

I can make that using Metronic Menu dropdown, Input box and htmx... but I was hopping something like that exist in metronic, or a Hint to make it..

I remember once that I came accross something like this, but forget where...

Thank you
-----------------------------------------------------------------------------------



Hi,

Have you checked Tagify plugin ? This option seems more relevant to your use case.

Regards.



If someone has this problem, I Found a simple and better approach.

Use the option : data-tags="true" for Select2 component

Thank you guys



Hi happy,

Glad to know that. All the best with your projects!

Regards.


Text formatting options
Submit
Text formatting options
Submit