Dynamic Form

[lordjohar]

hi
I want to create a dynamic form like this

but I cant
may you help me please
I write this code but it works incorrect
plz help me
i spend 3 day time to solve this
but i cant

var i ;
i=1;
function Form(formName)
	{
		var newform = document.createElement('form');
		newform.innerHTML = "<br>Form " + (i + 1) + "<br>\
		<span >\
			<span>\
				<input type='button' value='New Form' onClick=\"Form('Form')\" >"+" "+"\
				<input type='button' value='New Row'onClick=\"Row('Row')\" >"+" "+"\
				Input Text: <input type='text' name='firstname' />"+" "+"\
				<select>\
					<option></option>\
					<option>One</option>\
					<option>Two</option>\
					<option>Three</option>\
					<option>Four</option>\
				</select>\
			</span>\
		</span>"
		document.getElementById(formName).appendChild(newform);
		i++;
		newform.className= "form"+i;
	}
j=1;
function Row(spanName)
	{
		var newspan = document.createElement('span');
		newspan.innerHTML = "<br>Form "+ i +" Row " + (j + 1) + "<br>\
		<span>\
			<input type='button' value='New Form' onClick=\"Form('Form')\" >"+" "+"\
			<input type='button' value='New Row' onClick=\"Row('Row')\" >"+" "+"\
			Input Text: <input type='text' name='firstname' />"+" "+"\
			<select>\
				<option></option>\
				<option>one</option>\
				<option>two</option>\
				<option>three</option>\
				<option>four</option>\
			</select>\
		</span>";
		document.getElementById(spanName).appendChild(newspan);
		j++;
		newspan.className="Row"+j;
	}

------------------------------------------------------------------------

<script src="javascript.js" language="Javascript" type="text/javascript"></script>
<div id="Form">
	<form class="form1"method="POST">
		Form 1<br/>
		<span id="Row">
			<span>
				<input type="button" value="New Form" onClick="Form('Form')"/>			
				<input type="button" value="New Row"  onClick="Row('Row')"/>
				Input Text: <input type="text" name="firstname" />
				<select>
					<option value=""></option>
					<option>One</option>
					<option>Two</option>
					<option>Three</option>
					<option>Four</option>
				</select>
			</span>
		</span>
	</form>
</div>

[paul_wilkins]

I want to create a dynamic form like this

I don't understand from the image what you are trying to achieve.
'
Can you provide further details about what it is that you need help with?

[lordjohar]

I want a form that when click on each button create new row
if click on Square a new row separated
if click on circle a new row that is child
--------
excuse me for my bad English