ASP实现动态添加表单内容的实例程序

　　很多时候，不知道需要表单的数目，就需要能对表单进行数量的控制。收集了如下两个效果：

　　效果1:

<html><body><form name="form1"><table id="tb1" border=0> <tr><td><a href="#" onclick="return addFj()">添加附件</a></td></tr></table><input type="hidden" name="fjCnt" value="1" /></form></body></html><script language="javascript"> function addFj() { var oTb = document.getElementById("tb1"); var oTr = oTb.insertRow(0); var name = "thefilename"+document.form1.fjCnt.value; document.form1.fjCnt.value=parseInt(document.form1.fjCnt.value)+1; oTr.insertCell(0).innerHTML = "<input id='file' name='"+name+"' type=file style='width:400px;'> <input type=button onclick='return delFj(this)' value='删除'>" return false; } function delFj(obj) { obj.parentElement.parentElement.removeNode(true); return false; }</script>

[Ctrl+A 全部选择提示：你可先修改部分代码，再按运行]

　　效果2:

<HTML><HEAD><STYLE TYPE="text/css"></STYLE><SCRIPT LANGUAGE="vbscript">function addfile()dim strstr="<table>"if not IsNumeric (window.form1.filenum.value) then window.form1.filenum.value =1for i=1 to window.form1.filenum.valuestr=str&"<tr><td valign='middle'>文件"&i&":</td><td><input type='file' name='file"&i&"' class='tx1' value size='20'>　　保存为<input type='text' name='file"&i&"' size='20' class='tx2'></td></tr>"nextwindow.uptd.innerHTML =str&"</table>"end function</SCRIPT><SCRIPT LANGUAGE="JavaScript"></SCRIPT><TITLE></TITLE><META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=gb2312"></HEAD><BODY BGCOLOR="#ffffff" CLASS="p9" onLoad="addfile()"><FORM METHOD="post" NAME="form1" ACTION="savetofile.asp" ENCTYPE="multipart/form-data"> <TABLE BORDER="0" ALIGN="center" CELLPADDING="0" CELLSPACING="0"> <TR> <TD><DIV ALIGN="center"><FONT COLOR="#0000ff" SIZE="5">保存到文件</FONT></DIV></TD> </TR> <TR> <TD><TABLE WIDTH="750" BORDER="1" ALIGN="center" CELLPADDING="0" CELLSPACING="0" BORDERCOLOR="#111111" STYLE="BORDER-COLLAPSE: collapse"> <TR> <TD HEIGHT="27" COLSPAN="2">上传 <INPUT NAME="filenum" CLASS="tx2" VALUE="1" SIZE="4"> 个文件　　 <INPUT TYPE="button" NAME="Button" CLASS="bt" onClick="addfile" VALUE="设定"> </TD> </TR> <TR> <TD> <DIV ID="uptd"> </DIV></TD> </TR> <TR> <TD HEIGHT="30" COLSPAN="2" ALIGN="middle"> <INPUT TYPE="Button" NAME="Button" CLASS="bt" VALUE="看看有几个框" onclick="Show()"> <INPUT TYPE="submit" NAME="Button" CLASS="bt" VALUE="上传"> 　　 <INPUT TYPE="reset" NAME="Button" CLASS="bt" VALUE="重置"> </TD> </TR> </TABLE></TD> </TR> </TABLE></FORM></BODY></HTML>

[Ctrl+A 全部选择提示：你可先修改部分代码，再按运行]

在asp中，动态表单可按普通表单一样进行提交。简易的方法是设定一个固定表单的name，当有多个表单提交时，各表单数据会自动用"，"隔开，然后用split进行分割，再循环进行分别提交。如下：

<%@LANGUAGE="VBSCRIPT" CODEPAGE="936"%>
<script language="javascript">
function addTxtProductNameBox()
{
      var oTb = document.getElementById("TableProductName");
      var oTr = oTb.insertRow(0);
      oTr.insertCell(0).innerHTML ="<input name='txtProductName' type='text'><input type=button onclick='return delTxtProductNameBox(this)' value='删除'>"
      return false;
}
function delTxtProductNameBox(obj)
{
      obj.parentElement.parentElement.removeNode(true);
      return false;
}
</script>
<% dim rs3,sql3,productNameArray
    if productName<>"" then
    set rs3=server.CreateObject ("ADODB.RecordSet")
    sql3="select * from AmdiProduct"
    rs3.open sql3,conn,3,2
    productNameArray=split(productName,",")
    for i = 0 to ubound(productNameArray)
    rs3.addnew
    rs3("CompanyID")=companyId
    rs3("ProductName")=productNameArray(i)
    rs3.update
    next
    rs3.close
                set rs3=nothing
    end if
%>
<form name="form1" method="post" action="">
产品名称:<a href="#" onclick="addTxtProductNameBox()">添加产品名称</a>
<table id="TableProductName" border=0>
   <tr><td> </td></tr>
</table>
<input name="submit" type="submit" id="submit" value="== 提交 ==" />
</form>

分享到：