Hi,

I need some help about dis.

I want to create 10 textbox automaticaly (if i give 10 in coding it will create 10 textbox automaticaly.using javascript how to do this) but not using HTML.Can anyone help me how to do this in js

Thanks
Punitha Pary

Hope this helps

<script>
function addEvent()
{
var ni = document.getElementById('myDiv');
var spant = document.getElementById('span1');

var numi = document.getElementById('theValue');
var num = (document.getElementById("theValue").value -1)+ 2;
numi.value = num;
document.form1.theValue.value = num;
var textIdName = "symptoms"+num;
var newText = document.createElement('TEXTAREA');
newText.cols = 35;
newText.rows = 3;
newText.name = textIdName;
newText.visibility = "visible";


ni.appendChild(newText);
ni.appendChild(document.createElement('BR'));

}
</script>
in html page
<input type="hidden" value="0" id="theValue" name="theValue"/>
 <tr>   
      <td height="22" align="left" valign="top" class="style5"><font face="Arial, Helvetica, sans-serif">dynamic textboxes</font></td>
		
   		<td valign="top">: </td>
    <td align="left">	
	<div id="myDiv">	</div>
	<span id="span1" name="span1"></span>
	<br />	</td>
   </tr>

i have missed where to keep event

in html page,add this code

<tr valign="top" bgcolor="#CCCCCC">
  <td height="16" colspan="6" align="center" valign="middle" bgcolor="#9CC7DE">
  <span class="style3"><font color="#006699"face="Arial, Helvetica, sans-serif"> Click</font></span>
<a href="javascript:;" class="vlite" onclick="addEvent();">Add new texxt box</a>&nbsp;&nbsp;&nbsp;&nbsp;
</td>

try this .......it may help
write this in the head part........

<script language="javascript">
function changeIt()
{
var i = 1;
my_div.innerHTML = my_div.innerHTML +"<br><input type='text' name='mytext'+ i>"

}
</script>

and write this in the body.........

<form name="form" action="post" method="">
<input type="text" name=t1>
<input type="button" value="test" onClick="changeIt()">
<div id="my_div"></div>

with this code whenever you'll click the button a new textbox will appear.

try this code ....
this code will generate text boxes based on dropdown...

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

<html>
<head>
<title>untitled</title>
<style type="text/css">

div.inputbox {
width: 200px;
font-size: 80%;
padding: 3px 0px 3px 50px;
}

</style>
<script type="text/javascript" language="javascript">

function setTextInputs(oSelect) {
var howmany = oSelect[oSelect.selectedIndex].value, add = true;
var n = 1, oForm = oSelect.form, oDiv, oInput;
while (oDiv = document.getElementById('Name' + n))
if (n++ > howmany) {
add = false;
oForm.removeChild(oDiv);
}
if (add)
for (n; n <= howmany; ++n) {
oDiv = document.createElement('div');
oDiv.setAttribute('id', 'Name' + n);
oDiv.className = 'inputbox';
oDiv.appendChild(document.createTextNode('Name ' + n + ': '));
oForm.appendChild(oDiv);

oInput = document.createElement('input');
oInput.setAttribute('type', 'text');
oInput.setAttribute('name', 'Name' + n);
oDiv.appendChild(oInput);
}
}

</script>
</head>
<body>
<form>
<p><strong>Number of People: </strong>
<select name="NoOfPpl" onchange="setTextInputs(this)">
<option value="0" selected="selected">- 0 -</option>
<option value="1">- 1 -</option>
<option value="2">- 2 -</option>
<option value="3">- 3 -</option>
<option value="4">- 4 -</option>
<option value="5">- 5 -</option>
<option value="6">- 6 -</option>
</select></p>
</form>
</body>
</html>

hai shanthi,
Its working....................

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.