Link to home
Start Free TrialLog in
Avatar of stevong
stevong

asked on

Javascript: Dynamically create new text fields

Hi everyone,

I wish to dynamically create new textbox/controls when user clicks on a hyperlink. Attached is the javascript that I've used.

But on Non-IE browsers, the values that was key-in the previous textbox will not be retained.

Any ways to over come it?

Please advise.

Thanks
<script language="javascript">
var i = 1;
function addnew()
{
	i++;
	var s = "<div>Contents:<br /><textarea name=\"contents" + i +  "\"></textarea></div>";
	document.getElementById("subbox").innerHTML = document.getElementById("subbox").innerHTML + s;
}
</script>

Open in new window

Avatar of MikeRCWatts
MikeRCWatts

Which browsers are you having trouble with?

This works OK for me on IE, Firefox 2, Opera, as below.

?Mike
<html>
<head>
 
<script language="javascript">
var i = 1;
function addnew()
{
	i++;
	var s = "<div>Contents:<br /><textarea name=\"contents" + i +  "\"></textarea></div>";
	document.getElementById("subbox").innerHTML = document.getElementById("subbox").innerHTML + s;
}
</script>
 
</head>
<body>
 
<input type=button value='Click to add another' onclick=addnew()>
<div id=subbox>
Div subbox
</div>
</body>
</html>

Open in new window

Avatar of stevong

ASKER

Thanks for response.

Yes. the code generates another control dynamically.

eg:

you have 1 textbox. u key in "hello world"

then u click "Add"

Another text box appears. u key in "hello world 2". But the previous text box - the "hello world " is gone.

U click add again, the 3rd text box appears, but "hello world 2" and "hello world" is gone. the previous textbox remains empty.


Regards

ASKER CERTIFIED SOLUTION
Avatar of MikeRCWatts
MikeRCWatts

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
Avatar of stevong

ASKER

Thanks. It works :)