Generating Textfield dynamically 1

pokhran98 · Dec 8, 2003

Hello friends,
can i generate textfields dynamically, i.e. on click of a button. I have a situation where i have to display textfields on button click. I was trying to do it through document.write() but no luck so far. I can't use layers as i have to generate 4 new textfields every time user clicks the button.
Is it possible?.
Plz Help. thanks in advance

mwolf00 · Dec 8, 2003

.value
val2 = document.getElementById("field2&quot

.value
val3 = document.getElementById("field3&quot

.value
val4 = document.getElementById("field4&quot

.value
theDiv = document.getElementById("myDiv&quot

theDiv.innerHTML += "<h5>Number " + count + "</h5>"
theDiv.innerHTML += val 1 + "<br>" + val2 + "<br>" + val3 + "<br>" + val4 + "<hr>"
}
</script>

<input id="field1">
<input id="field2">
<input id="field3">
<input id="field4">
<input type=button onClick="addEm()" value="Add">
<div id="myDiv"></div>

Programming today is a race between software engineers striving to build better and bigger idiot-proof programs, and the Universe trying to produce bigger and better idiots. So far, the Universe is winning. - Rick Cook (No, I'm not Rick)

pokhran98 · Dec 8, 2003

Hi mwolf00,
Thanks for the reply, it was very helpful, i was able to solve the problem(with slight changes), but got stuck somewhere else. I have to display textfields in table, therefore i have to insert rows(<tr> tags) as well but some how i am unable to generate <tr> tags through <div>. Although the code works fine without table. Plz help

thanks

Here is my revised code:
<html>
<head>
<title>
Test
</title>

<script>
count = 0;
function addEm(){
count ++;

val1 = "<input id='field1'>";
val2 = "<input id='field1'>";
val3 = "<input id='field1'>";
val4 = "<input id='field1'>";
theDiv = document.getElementById("myDiv&quot

;
theDiv.innerHTML += "<tr> <td><input id='field1'></td> <td><input id='field1'></td> </tr>" ;
}
</script>
<body>
<form name="f1">
<table border="1">
<tr>
<td><input id="field1"></td>
<td><input id="field1"></td>
</tr>
<tr>
<td><input id="field1"></td>
<td><input id="field1"></td>
</tr>
<div id="myDiv"></div>
<tr>
<td colspan="2"><input type=button onClick="addEm()" value="Add"></td>
</tr>
</form>
</body>
</html>

simonchristieis · Dec 9, 2003

theDiv.innerHTML += "<tr> <td><input id='field1'></td> <td><input id='field1'></td> </tr>" ;
should be

theDiv.innerHTML += "<table><tr> <td><input id='field1'></td> <td><input id='field1'></td> </tr></table>" ;

mwolf00 · Dec 10, 2003

Was out yesterday, did simonchristieis post solve your problem?

Programming today is a race between software engineers striving to build better and bigger idiot-proof programs, and the Universe trying to produce bigger and better idiots. So far, the Universe is winning. - Rick Cook (No, I'm not Rick)

pokhran98 · Dec 11, 2003

Thanks mwolf00 for asking simonchristieis's post solved my problem. Thanks simonchristieis.

Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Generating Textfield dynamically 1

pokhran98

Programmer

mwolf00

Programmer

pokhran98

Programmer

simonchristieis

Programmer

mwolf00

Programmer

pokhran98

Programmer

Similar threads

Part and Inventory Search

Sponsor