明天的明天 永远的永远 未知的一切 我与你一起承担 ??

是非成败转头空 青山依旧在 几度夕阳红 。。。
随笔 - 1277, 文章 - 0, 评论 - 214, 阅读 - 321万
  博客园  :: 首页  :: 管理
< 2025年3月 >
23 24 25 26 27 28 1
2 3 4 5 6 7 8
9 10 11 12 13 14 15
16 17 18 19 20 21 22
23 24 25 26 27 28 29
30 31 1 2 3 4 5

自动添加控件,一次提交多条记录。

Posted on   且行且思  阅读(441)  评论(0编辑  收藏  举报

多个文本框重复的情况。比如说我们在做简历添写的情况下,比如工作经历,我们可以做成动态的,他工作了几个单位,就让他点按钮,自己来增加

 

webForm1.aspx

复制代码
<%@ 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>
复制代码

 

webForm1.aspx.cs

 

 

复制代码
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
namespace jxtDemoSMS
{
    
public partial class WebForm1 : System.Web.UI.Page
    {
        
protected void Page_Load(object sender, EventArgs e)
        {
            
if (!Page.IsPostBack)
            {
                
            }
        }
        
protected void Button1_Click(object sender, EventArgs e)
        {
            
//这里要说一下,因为我们取得的值是这样的。1|2|3|4这样的值,所以你要根据你一共有多少控件来算哪几个是一组数据
            
//然后进行分组存储
            Response.Write(this.hdNames.Value + "<br>");
            Response.Write(
this.SelectName.Value);
        }
        
    }
}
复制代码

 

编辑推荐:
· AI与.NET技术实操系列:基于图像分类模型对图像进行分类
· go语言实现终端里的倒计时
· 如何编写易于单元测试的代码
· 10年+ .NET Coder 心语,封装的思维:从隐藏、稳定开始理解其本质意义
· .NET Core 中如何实现缓存的预热?
阅读排行:
· 25岁的心里话
· 闲置电脑爆改个人服务器(超详细) #公网映射 #Vmware虚拟网络编辑器
· 零经验选手,Compose 一天开发一款小游戏!
· 因为Apifox不支持离线,我果断选择了Apipost!
· 通过 API 将Deepseek响应流式内容输出到前端
点击右上角即可分享
微信分享提示