How to integrate all these search forms with just a single button?

Question

This is just a outline of the code, do not mind looks. I just want to know if there is any way that these four search forms(in the code) can be integrated with the search button in the bottom such that the search button should search in the website for all these four keywords at the same time and show the overall search of those four keywords. I have to integrate it to a website so can you please help me out?
I also have to know how to make this search form enable to search into the website. Will it do automatically and if not how to do it, just give me the hints, I know you are busy too.
Last one, I have used <datalist> to create options in the search but it does not show up in the mobile but it shows in the phone?
If you are using mobile could check that is it working in your phone?
Thank in advance
https://code.sololearn.com/Wk8BGbLAviMO/?ref=app

Answer 1

Just a few things I noticed. Maybe doesn't answer all your question, but might worth checking.

Change <forms> </forms> to <form> </form>

All the text input uses the same ID and name attribute. This should probably be unique for each search input.

The list pops-up when focus is on the input, just letting you know (I'm using SL mobile app).

Someone more knowledgeable will answer the "how to make it work" part soon. I'm not qualified to that.

Answer 2

Thanks for your help