Dropdown is not working.

[Mohammadhussain257]

I have add header code snippet from tailwind CSS in my angular 14 demo project just to check its look and feel. Everything work but it seems dropdown have a problem or it require some extra js file I really don't know. If someone know then please answer as this the first time I am implementing tailwind css in my project so any help would be appreciated.



As shown in image all dropdown stay as it is noting happens when click on dropdown button.

[wongjn]

For the Dropdown components in Tailwind UI they indeed need some JavaScript to work if you are using the pure HTML versions. You can read more about JavaScript integration in the documentation.

[Mohammadhussain257]

For the Dropdown components in Tailwind UI they indeed need some JavaScript to work if you are using the pure HTML versions. You can read more about JavaScript integration in the documentation.

All I am asking about what js file is required to work dropdown properly when use tailwind css in combination of angular. For instance, if I use bootstrap in any angular project then for the dropdown to work properly a popper.js file re require. Is there anything like popper.js in tailwind CSS when used in angular. If anyone know then please answer. Thank you in advance.

[wongjn]

As far as I understand it, for the HTML templates, they do not provide any JavaScript or require any other JavaScript libraries. It is up to you to write the JavaScript to make it function how you would like it to.

[Mohammadhussain257]

Yes I already read that. In my case how I am going to use that dropdown properly with angular because the dropdown stay static nothing happens when click on dropdown button. The list inside dropdown stay as open. But with bootstrap everything work with just little configuration in config file. What I am missing here I really don't know. Am I missing some configuration or some extra file to work dropdown correctly I don't know. If someone know then please answer.

[wongjn]

For the Dropdown pure HTML templates, you will have to write your own JavaScript to get dropdown button to affect the dropdown list. There is more work involved than with Bootstrap to get it working. You are not missing any configuration or extra files – you will need to write the functionality yourself to get it working.

[minahpro]

For ReactJS, I always use opacity-0 invisible and opacity-100 visible with transition-all duration-200 to get the best and nicest transition dropdown
read this