Can you use datalist with HTML textarea?

Question

I wanted to check if it's possible to use datalist with a textarea. I have it working with an input field, but the task I have here requires me to "add input suggestions to a one row textbox with datalist". Does that even make any sense?

            <fieldset>
                <legend>
                    Välj favoritbild med hjälp av datalist - skriv i listan nedan
                </legend>
                <input list="bilar" name="bil">
                <!--<TEXTAREA list="bilar" NAME="bil" ROWS="1"></TEXTAREA>  -->
                <datalist id="bilar">
                    <option value="Dodge Viper">
                    <option value="Honda Civic">
                    <option value="Corvette Z06">
                    <option value="Volvo V70">
                    <option value="Ferrari Spider 360">
                </datalist>                 
            </fieldset>

However, I can't get it working with my textarea (which is commented out above). It works with the input-element however.

Anyone know how I can get the above example working with a one-row textbox?

Answer 1

No, because datalist by definition associates with an input element. Moreover, selecting an item drom a datalist means replacing the entire value of the associated input element, instead of appending to it, which normally be the idea if you used predefined alternatives for a textarea element.

There is nothing illogical with the idea of a pre-made list of alternatives to use for text area input, but there is nothing for it in HTML at present (or being planned, as far as I known). It can be coded rather simply in JavaScript, though.

You can have a list of items, for example as a ul list, or even as a select element. You would then add a little JavaScript that causes the item text to be written or appended to the textarea element e.g. when an item is clicked on or a selection is made from a select list

There is normally no reason to have a single-line text input field as a textarea. It’s possible, just not useful, except perhaps in very special cases. Note that <textarea rows=1 ...> lets the user enter any number of lines, it just makes that very inconvenient.