Runtime create attribute

**janakrai** · 01-07-2009, 12:04 PM

how to create Runtime html tag attribute using javascript?

**codeexploiter** · 01-07-2009, 12:11 PM

Which attribute you want to create on which tag (element)?

**janakrai** · 01-09-2009, 05:01 AM

i have create select attribute ( multiple ) at runtime ! it possible ?

**jscheuer1** · 01-09-2009, 05:48 AM

First of all, runtime is an imprecise term as regards both javascript and HTML. Do you mean onload, or as the page is being parsed?

If the latter, the easiest way is of course to hard code the attribute to the select tag.

There are at least several other options, here are two -

As the page is parsed:

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
   "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

</head>
<body>
<select id="myselect">
<option>Something</option>
<option>Something</option>
<option>Something</option>
</select>

<script type="text/javascript">
document.getElementById('myselect').multiple = true;
</script>
</body>
</html>

Onload:

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
   "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script type="text/javascript">
onload = function(){
 document.getElementById('myselect').multiple = true;
}
</script>

</head>
<body>
<select id="myselect">
<option>Something</option>
<option>Something</option>
<option>Something</option>
</select>

</body>
</html>

**rangana** · 01-09-2009, 07:38 AM

Just a quick follow up question John, is the value of true for multiple attribute valid when doing like that (el.attribute=value)?

I thought it was only multiple that's valid.
http://www.w3.org/TR/html401/interact/forms.html#h-17.6

Hope to hear some of your thoughts.

**jscheuer1** · 01-09-2009, 12:33 PM

From the link you posted (emphasis added):

multiple [CI]
If set, this boolean attribute allows multiple selections. If not set, the SELECT element only permits single selections.

In case you didn't know, boolean means true or false. However, I believe you are correct as far as valid HTML/XHTML goes. But since this is javascript, things are different. The bottom line is that the browser will set the valid HTML for the DTD of the page visa vis its own requirements for it once javascript sets the boolean value.

To think of it another way, what I did wasn't exactly setting the attribute value of the tag. I set the boolean value of the property of the object. This has the same ultimate result in any compliant browser. If I had quoted 'true', it would have been invalid unless error corrected.

**rangana** · 01-09-2009, 01:14 PM

Okay, that makes sense. Thanks for clearing it up. Will take this from you:

Originally Posted by jscheuer1

I set the boolean value of the property of the object. This has the same ultimate result in any compliant browser.

**Twey** · 01-10-2009, 10:51 AM

If I had quoted 'true', it would have been invalid unless error corrected.

No, it would have the same effect — it would be type-coerced. It's only 'false' you've got to look out for, since it's truthy.

Not to repeat what John said, but maybe to shed light on it from a different angle: the attribute on the element is boolean (true or false) but HTML doesn't have boolean datatypes, so instead of writing multiple=true and multiple=false in HTML, we write multiple="multiple" or multiple="". In fact, that is mostly for XHTML compatibility: in HTML we would normally use shorthand, just writing multiple or else leaving the attribute out entirely.

**rangana** · 01-10-2009, 10:54 AM

Thank you Twey. That makes a lot more sense.

**jscheuer1** · 01-10-2009, 02:18 PM

Originally Posted by Twey

No, it would have the same effect — it would be type-coerced. It's only 'false' you've got to look out for, since it's truthy.

In my view, type coercion is a form of error correction. And just to be clear, though I'm pretty sure everyone immediately involved already gets this, false (unquoted) is fine. It's just that once it it is quoted, it becomes a string. Any non-empty string will in this situation be type coerced into a value of true.