Providing heading to table in parent form from child form

liunx · Jan 9, 2008

I have a parent form which has a "Add New" button. When Ever the clicks on this button a new window opens which contains some form fields. On clicking submit those fields go back to the main form as 1 row. User can add any number of rows in this manner. <br />
Here is the code for parent form: <br />
<br />
<html> <br />
<head> <br />
<script language="JavaScript"> <br />
function submitForm() <br />
{ <br />
form1.action="capitalRequestSubmit.jsp"; <br />
form1.submit(); <br />
} <br />
</script> <br />
</head> <br />
<body> <br />
<form name='form1' > <br />
<br />
<br />
<DIV id="mydiv"> </DIV> <br />
<br />
<br />
<input type="button" value="Add New" onclick='winnew=window.open("child.jsp","jsp","width=600,height=500,scrollbar=yes"); winnew.focus'> <br />
<input type="button" value="Submit" onClick='submitForm();'> <br />
</form> <br />
</body> <br />
</html> <br />
<br />
And here is the code for Child form <br />
<br />
<html> <br />
<head> <br />
<title>Child</title> <br />
<head> <br />
<script language="JavaScript"> <br />
<br />
<br />
function addTextboxIncome() <br />
{ <br />
var val0 = document.frmMain.name.value; <br />
var val1 = document.frmMain.specification.value; <br />
<br />
self.opener.document.getElementById("mydiv").innerHTML += '<TABLE width=143% class=tableMain border=2><TR><TD><textarea name="name" >'+val0+'</textarea></TD><TD> <textarea name="specification" >'+val0+'</textarea> </TD></TR></TABLE>'; <br />
<br />
window.close(); <br />
} <br />
</script> <br />
</head> <br />
<br />
<body> <br />
<FORM name="frmMain" > <br />
<TABLE border="2" align=center> <br />
<TR> <br />
<TH>Name of Item</TH> <br />
<TH>Specification</TH> <br />
</TR> <br />
</TABLE> <br />
<br />
<a href=http://www.webdeveloper.com/forum/archive/index.php/"#" tabindex="2101" onclick="addTextboxIncome();"><font size=2><b>Add</b></font></a> <br />
</form> <br />
</body> <br />
</html> <br />
<br />
(There r many fields but I am showing only 2 to avoid making it messy) <br />
It works perfectly fine till here. The problem in dispalying the headings in the parent page above all the rows. If I do this in the child form. <br />
<br />
self.opener.document.getElementById("mydiv").innerHTML += '<TABLE border=2><TR><TD>NAME</TD><TD>SPECIFICATION</TD></TR><TR><TD><textarea name="name" >'+val0+'</textarea></TD><TD> <textarea name="specification" >'+val0+'</textarea> </TD></TR></TABLE>'; <br />
<br />
the problem that comes is that the headings are displayed over every row in the parent form but I want it to display only once. If I put the code for heading in a seperate table in the parent form that displays it as a seperate row, so alignment for heading and data values do not match. I want the data values to display exactly under the heading (as part of single table) <br />
<br />
Thanks

Providing heading to table in parent form from child form

liunx

Guest