0

I noticed that in html5 I can write something like:

<datalist id="list1">
    <option value="A">
    <option value="B">
</datalist>

input1: <input list="list1">

input2: <input list="list1">

That creates two distinct input elements with the same option list.

I'd like to do the same using the classic select element.. I have a web page where I show a list of editable data in rows, and each row has (beside others) a select element. The option list is the same for every select element. If I could define the option list only once, the HTML would be much shorter. I'm thinking to something like :

    <select list="list1">
    </select>

but it doesn't work.

blacks
  • 1
  • 1
  • Do you want to use JavaScript for this? – unor Jan 07 '15 at 15:50
  • I was wondering if there is a way to express this in plain html. In this example the option list is static. Consider that in my real case I have a list with about 200 options, and this element could be repeated even 100 times. – blacks Jan 09 '15 at 11:30
  • To reduce the lines of html code I could render this element as simple textbox and transform it in a combobox when the user want to edit its value, or load the list with ajax based on the prefix of the text introduced, but I was hoping that what is possible with datalist would be possible with select element, too. – blacks Jan 09 '15 at 11:41

1 Answers1

0

This is not possible with HTML5, you’d need (server- or client-side) scripting for this.

The select element has no list attribute, and neither is there a different mechanism defined that would allow to reference a set of option elements.

You could use iframe or object elements to embed a document that contains this select element. However, this does not allow you to change the attributes of the select element itself, so it’s exactly the same on each occurence. (You can’t have the iframe/object as child of select, so the embedded document needs to have the parent select element.)

Community
  • 1
  • 1
unor
  • 92,415
  • 26
  • 211
  • 360