asp.net后台获取js表格的数据

最新推荐文章于 2021-07-02 14:29:52 发布

至死孤独

最新推荐文章于 2021-07-02 14:29:52 发布

阅读量997

点赞数

会ajax的飘过

看论坛里好多人在找后台获取js表格的数据，就把以前的方法放在这里了

前台：

[xhtml]view plaincopy 
   
 <%@ Page Language="C#" AutoEventWireup="true"  CodeFile="Default.aspx.cs" Inherits="_Default" %>  
   
 <!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>asp.net获取前台js表格的数据</title>  
     <style type="text/css"><!--  
     .dis-ime   
     {  
         ime-mode:disabled;  
     }  
       
 -->  
     </style>  
 </head>  
 <body>  
     <form id="form1" runat="server">  
     <h3>使用客户端添加表格的保存</h3>  
     <p>  
         主是就是在提交到服务器之前，处理好表格里的信息，然后赋值给hidden<br />  
         to mqtheone:这里我设置最后一列只能输入数字了，你可以参考一下  
     </p>  
     <div>  
           
         <table id="tab1">  
         <tr>  
             <th>名称</th>  
             <th>内容</th>  
             <th>值</th>  
             <th></th>  
         </tr>  
         <tr>  
             <td><input type="text" /></td>  
             <td><input type="text" /></td>  
             <td><input type="text" class="dis-ime" onkeypress="return check(event)"/></td>  
         </tr>  
         </table>  
         <input type="button" style="margin-left:400px" mce_style="margin-left:400px" value="添加信息" id="btnAddInfo" /><br />  
         <asp:Button ID="Button1" runat="server" Text="提交" OnClientClick="initData();"   
                 onclick="Button1_Click" />  
         <asp:HiddenField ID="HiddenField1"  
             runat="server" />  
       
     </div>  
     </form>  
 </body>  
 <script type="text/javascript"><!--  
 var $=function(){return document.getElementById(arguments[0]);};  
   
 var check=function(e) {  
     return e.keyCode<=57 && e.keyCode>=48  
 }  
   
 $("btnAddInfo").onclick=function() {  
     var tb=$("tab1");//to mqtheone:这里你可用服务器那个table的id，或者查找页面的第一个table  
     var row=tb.insertRow(tb.rows.length);  
     for(var i=0;i<2;i++) {  
         var td=row.insertCell(i);  
         td.innerHTML="<input type='text'/>";  
     }  
     row.insertCell(row.cells.length).innerHTML="<input type='text' class='dis-ime' οnkeypress='return check(event)'/>";//样式表禁用输入法，再过滤再数字字符,还没有禁用粘贴，  
     row.insertCell(row.cells.length).innerHTML="<input type='button' οnclick='return remove(this)' value='移除'/>";  
 }  
 var remove=function(obj) {  
     var tr=obj.parentNode.parentNode;  
     tr.parentNode.removeChild(tr);  
 }  
   
 var initData=function() {  
     var tb=$("tab1");  
     var data=[];  
     for(var i=1;i<tb.rows.length;i++) {  
         if(tb.rows[i].cells[0].firstChild.value.length>0 && tb.rows[i].cells[1].firstChild.value.length>0) {//将两个文本框里值不为空的项添加到数组,假设只有前两列的数据不能为空  
             data.push(tb.rows[i].cells[0].firstChild.value);  
             data.push(tb.rows[i].cells[1].firstChild.value);  
             data.push(tb.rows[i].cells[2].firstChild.value);  
         } //else {这里可以给个提示说数据没填完整，是否提交，否则return false}  
     }  
     $("HiddenField1").value=data.join("`");//使用这个比较不常用 的字符将数组拼接成字符串  
     return true;  
 };  
 //这里可以增加一个方法判断 hidden是否为空，如果不为空，获取数据遍历，添加到表格中  
 // --></script>  
 </html>  

后台获取：

[c-sharp]view plaincopy 
   
 using System;  
 using System.Configuration;  
 using System.Data;  
 using System.Linq;  
 using System.Web;  
 using System.Web.Security;  
 using System.Web.UI;  
 using System.Web.UI.HtmlControls;  
 using System.Web.UI.WebControls;  
 using System.Web.UI.WebControls.WebParts;  
 using System.Xml.Linq;  
   
 public partial class _Default : System.Web.UI.Page   
 {  
     protected void Page_Load(object sender, EventArgs e)  
     {  
   
     }  
     protected void Button1_Click(object sender, EventArgs e)  
     {  
         if (HiddenField1.Value != "")  
         {  
             string[] datas = HiddenField1.Value.Split('`');  
             int i = 0;  
             System.Collections.Hashtable tb = new System.Collections.Hashtable();  
             DataTable dt = new DataTable();//取出数据放进DataTable  
             dt.Columns.Add("Name", typeof(string));  
             dt.Columns.Add("Content", typeof(string));  
             dt.Columns.Add("Value", typeof(int));  
             while (i < datas.Length)  
             {  
                 string str1=datas[i];//这样就取出数据了  
                 string str2 = datas[i + 1];  
                 string str3 = datas[i + 2];  
                 int v = 0;  
                 int.TryParse(str3, out v);  
                 DataRow dr = dt.NewRow();  
                 dr["Name"] = str1;  
                 dr["Content"] = str2;  
                 dr["Value"] = v;  
                 dt.Rows.Add(dr);  
                 i += 3;  
             }  
             Response.Write("数据行数为"+dt.Rows.Count);  
         }  
     }  
 }  