Alternative of custom attrbutes for tags to store some information in HTML 4

Question

Hello All:

Can some body tell me any alternative to store some information for a particular tag in HTML 4. For example If I have a drop down like

<select>
<option value="0" regionId="1">Test1</option>
<option value="1" regionId="2">Test2</option>
</select>

Here regionId is a custom attribute, I am able to access the attribute but the W3C HTML validation is failing. Any suggestion on this?

Answer 1

You can use javascript with JSon. It is widely used and there are lots of supporting libraries for many languages to produce JSon.

Answer 2

you could use a javascript library like jQuery. It allows you to set some data to any dom onject you want. In your example you could use $('select > option[value=0]').data('regionId', '1') and retrieve this information by using $('select > option[value=0]').data('regionId') or $('select > option[value=0]').regionId. A pure HTML way would be to find any valid attribute you could store your information in, but in most cases it would be a bad practice because you are misusing the attribute. Here you can find a list of all valid attributes per html tag: http://www.htmldog.com/reference/htmltags/

Answer 3

Why not using a normal id attribute?

<select>
<option value="0" id="region_1">Test1</option>
<option value="1" id="region_2">Test2</option>
</select>

To have valid HTML you CAN'T use your own custon attributes. But with OPTION you can use id, class or title for this kind of information and id is the best for your needs.

EDIT: As an id must not contain only a number, I appended "region_" which you can remove within the code you are accessing the attribute.

Answer 4

Use HTML and data-* attributes. See http://stackoverflow.com/questions/427262/can-i-just-make-up-attributes-on-my-html-tags