Submitting value of dynamically created element 1

PoppapumpJ · Mar 26, 2003

I have a table with a hardcoded table and textboxes.

The user can click the "Add Row" button and a new row will be added to the table for them to input text.

Now the question is, why is the data collected in that newly created text box not passed during the submit.

For want it's worth, I am using ASP for ServerSide processing. Form method get is not allowed by comp policy. It has to be submitted via form.

I can access data of text boxes 1-5 because they are Hardcoded in the HTML.

Is there are way to pass the data in the created textboxes

Here is an example of what I am attempting:

[tt]
<%@ Language=VBScript %>
<HTML>
<HEAD>
<META NAME="GENERATOR" Content="Microsoft Visual Studio 6.0">

<script>
function addRow(){
//alert("got here&quot

var numRows = document.all.testTable.rows.length
var newRow = document.all.testTable.insertRow(numRows - 1)
newRow.insertCell(0)
newRow.insertCell(1)
newRow.insertCell(2)

newRow.cells(0).innerHTML = "test"
newRow.cells(1).innerHTML = "<INPUT type='text' name=text'" + (numRows-1) + "'>"
newRow.cells(2).innerHTML = " "
}
</script>

</HEAD>
<BODY>
<%
Response.Write Request.Form("text6&quot

%>

<FORM action=<%=Request.ServerVariables("URL&quot

%> method=post>
<TABLE ID="testTable" border = 1 cellspacing = 0 cellpadding=5>
<TR>
<TD>test</TD>
<TD><INPUT type="text" name=text1></TD>
<td> </TD>
</TR>
<TR>
<TD>test</TD>
<TD><INPUT type="text" name=text2></TD>
<td> </TD>
</TR>
<TR>
<TD>test</TD>
<TD><INPUT type="text" name=text3></TD>
<td> </TD>
</TR>
<TR>
<TD>test</TD>
<TD><INPUT type="text"name=text4></TD>
<td> </TD>
</TR>
<TR>
<TD>test</TD>
<TD><INPUT type="text" name=text5></TD>
<td> </TD>
</TR>
<TR>
<td colspan=3 align=center><a href="#" onclick="javascript: addRow();">add reject reason</a></TD>
</TR>
</TABLE>

<INPUT type="submit" value="Submit" id=submit1 name=submit1>
</form>

</BODY>
</HTML>

[/tt]

Is this even possible

palbano · Mar 26, 2003

instead of using .innerHTML use document.createElement. That way you get a DOM Node object inserted into the tree.

Of course you have to append it to the parent element etc., but anyway i have successfully used it for form submittal.

-pete

PoppapumpJ · Mar 26, 2003

That's Awesome!!

Thanks

This is an exaple of the code that does what I want

[tt]
<%@ Language=VBScript %>
<HTML>
<HEAD>
<META NAME="GENERATOR" Content="Microsoft Visual Studio 6.0">

<script>
function addRow(){
//alert("got here&quot

var numRows = document.all.testTable.rows.length
var newRow = document.all.testTable.insertRow(numRows - 1)
var newInput = document.createElement("input&quot

document.createElement("name&quot

document.createElement("value&quot

newInput.setAttribute("name", "text" + (numRows))
//alert(numRows)

newRow.insertCell(0)
newRow.insertCell(1)
newRow.insertCell(2)

newRow.cells(0).innerHTML = "test"
newRow.cells(1).appendChild(newInput); //.innerHTML = "<INPUT type='text' name=text'" + (numRows-1) + "'>"
newRow.cells(2).innerHTML = "&nbsp"
}
</script>

</HEAD>
<BODY>
<%
Response.Write Request.Form("text6&quot

%>

<FORM action=<%=Request.ServerVariables("URL&quot

%> method=post>
<TABLE ID="testTable" border = 1 cellspacing = 0 cellpadding=5>
<TR>
<TD>test</TD>
<TD><INPUT type="text" name=text1></TD>
<td>&nbsp</TD>
</TR>
<TR>
<TD>test</TD>
<TD><INPUT type="text" name=text2></TD>
<td>&nbsp</TD>
</TR>
<TR>
<TD>test</TD>
<TD><INPUT type="text" name=text3></TD>
<td>&nbsp</TD>
</TR>
<TR>
<TD>test</TD>
<TD><INPUT type="text"name=text4></TD>
<td>&nbsp</TD>
</TR>
<TR>
<TD>test</TD>
<TD><INPUT type="text" name=text5></TD>
<td>&nbsp</TD>
</TR>
<TR>
<td colspan=3 align=center><a href="#" onclick="javascript: addRow();">add Row</a></TD>
</TR>
</TABLE>

<INPUT type="button" value="Button" id=button1 name=button1 onclick="javascript: alert(document.all.text6.name)">
<INPUT type="submit" value="Submit" id=submit1 name=submit1>
</form>

</BODY>
</HTML>

[/tt]

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!

Submitting value of dynamically created element 1

PoppapumpJ

Programmer

palbano

Programmer

PoppapumpJ

Programmer

Similar threads

Part and Inventory Search

Sponsor