Create a RadioButton in Code for NN

**Michael Winter** · Jul 20 '05, 01:39 PM

Re: Create a RadioButton in Code for NN

On 18 Jan 2004 14:49:35 GMT, Mark <anonymous@devd ex.com> wrote:
[color=blue]
> Hi - my code below works in IE6, but not in NN7 - I thought it was using
> the correct standards, but could anyone please tell me where I'm going
> wrong?[/color]

The createElement() method is supposed to receive the element name only.
You passed the entire tag.

I'm not clear (having not done it before) on how one then sets the
attributes. The two choices are altering the properties of the new Element
instance, or creating the attributes with createAttribute () and adding
them with setAttribute(). Can anyone indicate which is the most correct
way of doing it?

Mike

--
Michael Winter
M.Winter@blueyo nder.co.invalid (replace ".invalid" with ".uk" to reply)

**Randy Webb** · Jul 20 '05, 01:39 PM

Re: Create a RadioButton in Code for NN

Michael Winter wrote:
[color=blue]
> On 18 Jan 2004 14:49:35 GMT, Mark <anonymous@devd ex.com> wrote:
>[color=green]
>> Hi - my code below works in IE6, but not in NN7 - I thought it was using
>> the correct standards, but could anyone please tell me where I'm going
>> wrong?[/color]
>
>
> The createElement() method is supposed to receive the element name only.
> You passed the entire tag.
>
> I'm not clear (having not done it before) on how one then sets the
> attributes. The two choices are altering the properties of the new
> Element instance, or creating the attributes with createAttribute () and
> adding them with setAttribute(). Can anyone indicate which is the most
> correct way of doing it?[/color]

Alter its properties.
There have been problems when trying to use setAttribute().

--
Randy

DU · Jul 20 '05, 01:39 PM

Re: Create a RadioButton in Code for NN

Mark wrote:
[color=blue]
> Hi - my code below works in IE6, but not in NN7 - I thought it was using
> the correct standards,[/color]

No. It uses a dedicated workaround for MSIE 6.

but could anyone please tell me where I'm going[color=blue]
> wrong?
>[/color]

Your code is not using valid markup to start with.
[color=blue]
> Thanks, Mark
>
> <HTML>
> <HEAD>
> <SCRIPT>
> function createRadioButt on(){
> var newRadioButton = document.create Element("<INPUT TYPE='RADIO'
> NAME='RADIOTEST ' VALUE='First Choice'>")
> alert(newRadioB utton);
> document.getEle mentById("mtwri te").appendChil d(newRadioButto n);
> }
> </SCRIPT>
>
> </HEAD>
>
> <BODY>
> <INPUT TYPE="BUTTON" ONCLICK="create RadioButton()" VALUE="Create two
> Radio Buttons"><BR>
> <table><tr><t d id="mtwrite"></td></tr></table>
> <BODY>
> </HTML>
>[/color]

The following will work in NS 7.1, Mozilla 1.6, Opera 7.50 and MSIE 6
for windows. The code was tested on these browsers in a XHTML 1.0 strict
webpage.

javascript:
-----------

function DynamicallyCrea te2RadioButtons ()
{
var LabelFirstInput = document.create Element("label" );
var LabelSecondInpu t = document.create Element("label" );
if(document.all && !window.opera && document.create Element)
{
var FirstInput = document.create Element("<input type='radio'
name='radiotest ' id='idFirstInpu tRadio' value='first choice'>");
var SecondInput = document.create Element("<input type='radio'
name='radiotest ' id='idSecondInp utRadio' value='second choice'>");
}
else if(document.cre ateElement && document.create TextNode)
{
var FirstInput = document.create Element("input" );
var SecondInput = document.create Element("input" );
FirstInput.type = SecondInput.typ e = "radio";
FirstInput.name = SecondInput.nam e = "radiotest" ;
FirstInput.id = "idFirstInputRa dio";
SecondInput.id = "idSecondInputR adio";
FirstInput.valu e = "first choice";
SecondInput.val ue = "second choice";
}
else
{
return
};
LabelFirstInput .appendChild(Fi rstInput);
LabelFirstInput .htmlFor = "idFirstInputRa dio";
LabelFirstInput .appendChild(do cument.createTe xtNode("First option"));
document.forms[0].childNodes[0].appendChild(La belFirstInput);

document.forms[0].childNodes[0].appendChild(do cument.createEl ement("br"));

LabelSecondInpu t.appendChild(S econdInput);
LabelSecondInpu t.htmlFor = "idSecondInputR adio";
LabelSecondInpu t.appendChild(d ocument.createT extNode("Second option"));
document.forms[0].childNodes[0].appendChild(La belSecondInput) ;
}

HTML
----
<body onload="Dynamic allyCreate2Radi oButtons();">
<form action=""><p></p></form>

DU

DU · Jul 20 '05, 01:39 PM

Re: Create a RadioButton in Code for NN

Michael Winter wrote:
[color=blue]
> On 18 Jan 2004 14:49:35 GMT, Mark <anonymous@devd ex.com> wrote:
>[color=green]
>> Hi - my code below works in IE6, but not in NN7 - I thought it was using
>> the correct standards, but could anyone please tell me where I'm going
>> wrong?[/color]
>
>
> The createElement() method is supposed to receive the element name only.
> You passed the entire tag.[/color]

That's because this is the only known way to create and embed radio
inputs in MSIE 6. Such dedicated workaround for MSIE and way of coding
the createElement was mentioned before in this newsgroup IIRC.
[color=blue]
>
> I'm not clear (having not done it before) on how one then sets the
> attributes. The two choices are altering the properties of the new
> Element instance,[/color]

and that is the most frequent choice (and most relevant to use) one need
to use in 95% of the time. DOM 1 HTML list all assignable HTML attributes.
E.g. for form input:

Document Object Model HTML

http://www.w3.org/TR/DOM-Level-2-HTML/html.html#ID-6043025

DU

or creating the attributes with createAttribute () and[color=blue]
> adding them with setAttribute(). Can anyone indicate which is the most
> correct way of doing it?
>
> Mike
>[/color]

Create a RadioButton in Code for NN

Create a RadioButton in Code for NN

Comment

Comment

Comment

Comment