asp.net 动态添加控件

最新推荐文章于 2019-03-23 12:19:00 发布

原创最新推荐文章于 2019-03-23 12:19:00 发布 · 948 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#asp.net #button #string #input #function #server

c#用法技巧同时被 3 个专栏收录

10 篇文章

订阅专栏

asp.net

4 篇文章

订阅专栏

JQuery

2 篇文章

订阅专栏

本文介绍了一个使用ASP.NET实现的学生信息动态添加案例。通过客户端JavaScript动态生成表单元素，并在服务器端通过按钮点击事件收集并处理这些信息。文章详细展示了如何在页面加载时初始化学生数据，并在点击按钮时获取表单中所有学生的姓名和年龄。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

 using System;

using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;


public partial class Default2 : System.Web.UI.Page
{
    List<Student> preStus = new List<Student>();
    protected void Page_Load(object sender, EventArgs e)
    {
        Student stu = new Student();
        stu.Age = "23";
        stu.Name = "zhangsan";
        Student stu1 = new Student();
        stu1.Age = "23";
        stu1.Name = "zhangsan";
        preStus.Add(stu);
        preStus.Add(stu1);
        string jsMethodLoad = "";
        if (!IsPostBack)
        {
            for (int i = 0; i < preStus.Count; i++)
            {
                jsMethodLoad += " addnew('"+preStus[i].Name+"','"+preStus[i].Age+"');";
            }
        }
        this.RegisterStartupScript("ss", "<script> " + jsMethodLoad + "</script>");
       // Response.Write("<script> " + jsMethodLoad + "</script>");


    }
    protected void Button1_Click(object sender, EventArgs e)
    {
        System.Collections.Specialized.NameValueCollection nv = this.Request.Form;
        List<Student> stus = new List<Student>();
        foreach (string item in nv)
        {


            if (item.StartsWith("Student.name") && item!="Student.name")
            {
                string[] eles = item.Split('.');
                Student stu = new Student();
                foreach (string subitem in nv)
                {
                    if (subitem.EndsWith("name." + eles[2]))
                    {
                        stu.Name = Request.Form[subitem];
                    }
                    else if (subitem.EndsWith("age." + eles[2]))
                    {
                        stu.Age = Request.Form[subitem];
                    }
                }
                stus.Add(stu);
            }
        }


    }
    public class Student
    {
        string name;


        public string Name
        {
            get { return name; }
            set { name = value; }
        }
        string age;


        public string Age
        {
            get { return age; }
            set { age = value; }
        }
    }
 
}

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default2.aspx.cs" Inherits="Default2" %>

<!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>

    <script src="js/jquery-1.6.1.min.js" type="text/javascript"></script>
    

     <script type="text/javascript">

             var i = 0;
			function addnew(name,name,age){
				var temp= $("div[name='_template']").clone(); 
				temp.attr('name','ready');
				var inputs= temp.find('input');
				inputs.each(function() {
                    //根据input-name 来修给初始值
				    var iName = $(this).attr('name')
				    if (name != null && iName == "Student.name") {
				        $(this).attr('value', name);
				    } else if (age != null && iName == "Student.age") {
				        $(this).attr('value', age);
				    }
				    //编号索引
				    $(this).attr('name', $(this).attr('name') + "." + i);


				});
				var container=$("#_container");
				container.append(temp);
				i++;
			}
		
//		
//			
//			
//			function SetJsonResult() {
//			    var container = $("#_container");
//			    var result = "[";


//			    var isFirstt = true;
//			    container.find("div[name='ready']").each(
//			        function() {
//			                if (!isFirstt) {
//			                      result += ",";

//			                } else {
//			                   isFirstt = false;
//			                }
//			            result += "{";

//			            var temp = $(this);

//			            var isFirst = true;
//			            temp.find("input[type='text']").each(function() {
//			                if (!isFirst) {
//			                    result += ",";

//			                } else {
//			                    isFirst = false;
//			                }
//			                result += $(this).attr('name') + ":" + $(this).attr('value');
//			            });

//			            result += "}";
//			        }
//			    );
//			        result += "]";
//			        
//			    $("#Text1").attr('value',result);
//			    
			}
	</script>

    <style type="text/css">
        #Text1
        {
            width: 374px;
            height: 152px;
        }
    </style>

</head>
<body>
    <form id="form1" runat="server">
    <div>
        	<input type='button' onclick='addnew()' value='add'>
	        <div name="_template">
		        name<input type ='text' name ='Student.name'>
		        age <input type='text' name ='Student.age'>

	        </div>
	        <div id='_container'>
        	
	       </div>
    </div>
    <input id="Text1" type="text" />
    <input id="Button2" type="button" onclick="SetJsonResult()" value="button" />
    <asp:Button ID="Button3" runat="server" Text="Button" />
    <asp:Button ID="addtoplace" runat="server" onclick="addtoplace_Click" 
        Text="addtoplace" />
 
 
    <asp:PlaceHolder ID="PlaceHolder1" runat="server">
    
    
    </asp:PlaceHolder>
 
    </form>
</body>
</html>