自动添加控件

来源:互联网 发布:美萍 前台pos 源码 编辑:程序博客网 时间:2024/06/06 08:25

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="jxtDemoSMS.WebForm1" %>  
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
<html xmlns="http://www.w3.org/1999/xhtml" >  
<head runat="server">  
    <title></title>  
     <mce:script language="javascript" type="text/javascript"><!--  
       
     //这里的max主要是限制一下最多可以加几个,如果不想限制可以不用  
        function addFile(max)  
        {  
            var Text1 = document.getElementsByName("Text1");  
            if (Text1.length == 1 && Text1[0].disabled == true)  
           {  
               Text1[0].disabled = false;  
               return;  
           }  
           if (Text1.length < max)  
           {  
               var fileButton = '<br />姓名:<input id="Text1" name="Text1" type="text" />&nbsp;&nbsp;&nbsp;&nbsp;性别:<input id="Text2" name="Text2" type="text" /> <select id="Select1" name="D1"><option value="中国">中国</option><option value="美国">美国</option><option value="日本">日本</option></select>';  
               //alert(fileButton);  
               document.getElementById("FileList").insertAdjacentHTML("beforeEnd",fileButton);  
           }  
       }  
       //这里的方法是采用了隐藏域的方法,把得到的信息放到隐藏域里,这里分了二个,一个是用来存input的一个是用来存select的  
       function getNames() {  
           var hdArea = document.getElementById("<%=hdNames.ClientID %>");  
           var hdArea2 = document.getElementById("<%=SelectName.ClientID %>");  
           var controlArea = document.getElementById("FileList");  
           var list = controlArea.getElementsByTagName("input");  
           var nameStr = "";  
           for (var i = 0; i < list.length; i++) {  
               nameStr += list[i].value;  
               nameStr += "|";  
           }  
           var list2 = controlArea.getElementsByTagName("select");  
           var nameStr2 = "";  
           for (var i = 0; i < list2.length; i++) {  
               nameStr2 += list2[i].value;  
               nameStr2 += "|";  
           }  
           hdArea.value = nameStr.substr(0, nameStr.length - 1);  
           hdArea2.value = nameStr2.substr(0, nameStr2.length - 1);  
       }  
       
// --></mce:script>  
</head>  
<body>  
    <form id="form1" runat="server">  
      <p id="FileList">  
          
          姓名:<input id="Text1" name="Text1" type="text" />    性别:<input id="Text2" name="Text2" type="text" />  
          <select id="Select1" name="D1">  
              <option value="中国">中国</option>  
              <option value="美国">美国</option>  
              <option value="日本">日本</option>  
          </select></p>  
      
        <input id="Button2" type="button" value="添加" onclick="addFile(4)" /><asp:HiddenField   
          ID="SelectName" runat="server" />  
 <asp:HiddenField ID="hdNames" runat="server" />  
        <br><br><asp:Button ID="Button1" runat="server" Text="Button"   
          onclick="Button1_Click" OnClientClick="getNames()" />  
    </form>  
</body>  
</html> 

 

//页面

protected void Button1_Click(object sender, EventArgs e)  
        {  
            //这里要说一下,因为我们取得的值是这样的。1|2|3|4这样的值,所以你要根据你一共有多少控件来算哪几个是一组数据  
            //然后进行分组存储  
            Response.Write(this.hdNames.Value + "<br>");  
            Response.Write(this.SelectName.Value);  
        }