1<HTML>
2<HEAD>
3<TITLE>Dynamically add Textbox, Radio, Button in html Form using JavaScript</TITLE>
4<SCRIPT language="javascript">
5function add(type) {
6
7 //Create an input type dynamically.
8 var element = document.createElement("input");
9
10 //Assign different attributes to the element.
11 element.setAttribute("type", type);
12 element.setAttribute("value", type);
13 element.setAttribute("name", type);
14
15
16 var foo = document.getElementById("fooBar");
17
18 //Append the element in page (in span).
19 foo.appendChild(element);
20
21}
22</SCRIPT>
23</HEAD>
24<BODY>
25<FORM>
26<H2>Dynamically add element in form.</H2>
27Select the element and hit Add to add it in form.
28<BR/>
29<SELECT name="element">
30 <OPTION value="button">Button</OPTION>
31 <OPTION value="text">Textbox</OPTION>
32 <OPTION value="radio">Radio</OPTION>
33</SELECT>
34
35<INPUT type="button" value="Add" onclick="add(document.forms[0].element.value)"/>
36
37<span id="fooBar"> </span>
38
39</FORM>
40</BODY>
41</HTML>
42