html - Drop Down Menu/Text Field in one

Question

I'm working on building new site, and I need a drop down menu to select the amount of something in my site. But at the same time I need this drop down list to accept text. So if the client wants to choose from the drop down list then he can, also if the client want to enter the amount by text then he can also. As you can see I want to make it dual.

For example: suppose there is an amount drop down menu, and its elements are (1,2,3);

Suppose now that the client needs the amount to be 5 - this is his right - it does not exist in the drop down list, so the client now must enter the amount textually. So for any entry the client must either choose from the drop down list or enter the amount textually.

After the description of my problem, and the simple example that I have introduced to you, here is my question:

Is there HTML code to make a drop down menu and a text field in one, as dual, not separated?

Answer 1

You can do this natively with HTML5 <datalist>:

<label>Choose a browser from this list:
<input list="browsers" name="myBrowser" /></label>
<datalist id="browsers">
  <option value="Chrome">
  <option value="Firefox">
  <option value="Internet Explorer">
  <option value="Opera">
  <option value="Safari">
  <option value="Microsoft Edge">
</datalist>