HTML5 <input type="number" ... being able to show number as well as well as alphabets as choices

Question

I have the following HTML5 tag which is working fine but I want extra functionality in it.

<input class="form-field-short" type="number" min="1" max="5" value="0" name="someName" />

I get an input field with choices between 1 and 12.

Now I want it to allow strings along with the current choices.

For example.. 1, 2, 3, 4, 5, ABC, DEF, GHI, XYZ

Elsewhere, in my code, I have also used <select><option></option></select> but that is not what I want.
I am looking for <input type="number" ....> tag with the capability of showing numbers as well as words in the choices.

Answer 1

One option is a numeric text input that also lists some non-numeric options (usually shown in a pulldown menu by the browser):

<input type="text" list="list" inputmode="numeric"/>
<datalist id="list">
    <option value="ABC"/>
    <option value="DEF"/>
    <option value="GHI"/>
</datalist>

However, if the overall set of options, including numbers, is limited, then a <select> might be more appropriate, and is more widely supported:

<select>
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="ABC">ABC</option>
    <option value="DEF">DEF</option>
    <option value="GHI">GHI</option>
</select>

See this fiddle.