Problem in creating dynamic form...also, is it possible to add the fields from JAVASCRIPT directly to the database using JSP?...

Hello everyone,

I am using JSP with javascript for my application. I am a new user of
this field. I am creating a dynamic project entry form as written
below. I have a button named "ADD MORE PROJECT DETAILS". When i click
that button, it must create another project column(projectname2 and
status2). When again clicked it must create another
column(projectname3 and status3) and so on, without interrupting the
previous project columns.

I have written a script for that, but unfortunately the column is
being overwritten when i click the ADD MORE PROJECT DETAILS button.
Pls. take a look of my file and tell me whats wrong or what must be
used. Also, tell me whether i can add all these details from the
javascript to the database(POSTGRESQL) as in the case of JSP.

MY JSP FILE:

//.................blah blah blah...................

out.print("<tr>\n <td>Project Name 1</td><td style=\" border-width:
1\">");
out.print("<textarea name=\"projectname\" cols=\"70\"
rows=\"2\"></textarea>");
out.println("</td>\n </tr>");

out.print(" <tr>\n<td>Project Status 1</td><td style=\"border-width:
1\">");
out.print("<textarea name=\"status1\" cols=\"70\"
rows=\"2\"></textarea> ");
out.println("</td>\n </tr>");

// ................Additional fields ..........

out.print("<tr><td style=\"text-align: Center; colspan=\"2\"><input
type=\"button\" value=\"Add more Project details\"
onClick=\"javascript:addmore();\"></td>\n </tr>");

out.print("<tr><td>");
out.print("<span id=cust1 style=\"position:relative;\"></span>");
out.println("</td>\n </tr>");

out.print("<tr><td>");
out.print("<span id=cust2 style=\"position:relative;\"></span>");
out.println("</td>\n </tr>");

// ........then i have the SUBMIT BUTTON ........


MY JAVASCRIPT IS:

<script Language="JavaScript">

var num=1;
function addmore() {

num++;

data1 = "<font style='font-size: 11pt; color:
#00000'>Projectname"+num+"</font>";
data2 = "<textarea name='projectname"+num+"' cols='70'
rows='2'></textarea>";
data3 = "<font style='font-size: 11pt; color: #00000'>ProjectStatus
"+num+"</font>";
data4 = "<textarea name='status"+num+"' cols='70'
rows='2'></textarea>";

cust1.innerHTML = data1;
cust2.innerHTML = data2;
cust3.innerHTML = data3;
cust4.innerHTML = data4;
}
</script>


It would be great if you can suggest your views as soon as possible..

Thanx for spending your valuable time.

Cheers,
Jagdeesh.