前台:
代碼
<%@ Page Language=C# AutoEventWireup=true CodeFile=Defaultaspxcs Inherits=_Default %>
<!DOCTYPE html PUBLIC //WC//DTD XHTML Transitional//EN transitionaldtd>
<html xmlns=>
<head runat=server>
<title>獲取前台js表格的數據</title>
<style type=text/css><!
disime
{
imemode:disabled;
}
>
</style>
</head>
<body>
<form id=form runat=server>
<h>使用客戶端添加表格的保存</h>
<p>
主是就是在提交到服務器之前處理好表格裡的信息然後賦值給hidden<br />
to mqtheone:這裡我設置最後一列只能輸入數字了你可以參考一下
</p>
<div>
<table id=tab>
<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=disime onkeypress=return check(event)/></td>
</tr>
</table>
<input type=button mce_ value=添加信息 id=btnAddInfo /><br />
<asp:Button ID=Button runat=server Text=提交 OnClientClick=initData();
onclick=Button_Click />
<asp:HiddenField ID=HiddenField
runat=server />
</div>
</form>
</body>
<script type=text/javascript><!
var $=function(){return documentgetElementById(arguments[]);};
var check=function(e) {
return ekeyCode<= && ekeyCode>=
}
$(btnAddInfo)onclick=function() {
var tb=$(tab);//to mqtheone:這裡你可用服務器那個table的id或者查找頁面的第一個table
var row=tbinsertRow(tbrowslength);
for(var i=;i<;i++) {
var td=rowinsertCell(i);
tdinnerHTML=<input type=text/>;
}
rowinsertCell(rowcellslength)innerHTML=<input type=text class=disime onkeypress=return check(event)/>;//樣式表禁用輸入法再過濾再數字字符還沒有禁用粘貼
rowinsertCell(rowcellslength)innerHTML=<input type=button onclick=return remove(this) value=移除/>;
}
var remove=function(obj) {
var tr=objparentNodeparentNode;
trparentNoderemoveChild(tr);
}
var initData=function() {
var tb=$(tab);
var data=[];
for(var i=;i<tbrowslength;i++) {
if(tbrows[i]cells[]firstChildvaluelength> && tbrows[i]cells[]firstChildvaluelength>) {//將兩個文本框裡值不為空的項添加到數組假設只有前兩列的數據不能為空
datapush(tbrows[i]cells[]firstChildvalue);
datapush(tbrows[i]cells[]firstChildvalue);
datapush(tbrows[i]cells[]firstChildvalue);
} //else {這裡可以給個提示說數據沒填完整是否提交否則return false}
}
$(HiddenField)value=datajoin(`);//使用這個比較不常用 的字符將數組拼接成字符串
return true;
};
//這裡可以增加一個方法判斷 hidden是否為空如果不為空獲取數據遍歷添加到表格中
// ></script>
</html>
<%@ Page Language=C# AutoEventWireup=true CodeFile=Defaultaspxcs Inherits=_Default %>
<!DOCTYPE html PUBLIC //WC//DTD XHTML Transitional//EN transitionaldtd>
<html xmlns=>
<head runat=server>
<title>獲取前台js表格的數據</title>
<style type=text/css><!
disime
{
imemode:disabled;
}
>
</style>
</head>
<body>
<form id=form runat=server>
<h>使用客戶端添加表格的保存</h>
<p>
主是就是在提交到服務器之前處理好表格裡的信息然後賦值給hidden<br />
to mqtheone:這裡我設置最後一列只能輸入數字了你可以參考一下
</p>
<div>
<table id=tab>
<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=disime onkeypress=return check(event)/></td>
</tr>
</table>
<input type=button mce_ value=添加信息 id=btnAddInfo /><br />
<asp:Button ID=Button runat=server Text=提交 OnClientClick=initData();
onclick=Button_Click />
<asp:HiddenField ID=HiddenField
runat=server />
</div>
</form>
</body>
<script type=text/javascript><!
var $=function(){return documentgetElementById(arguments[]);};
var check=function(e) {
return ekeyCode<= && ekeyCode>=
}
$(btnAddInfo)onclick=function() {
var tb=$(tab);//to mqtheone:這裡你可用服務器那個table的id或者查找頁面的第一個table
var row=tbinsertRow(tbrowslength);
for(var i=;i<;i++) {
var td=rowinsertCell(i);
tdinnerHTML=<input type=text/>;
}
rowinsertCell(rowcellslength)innerHTML=<input type=text class=disime onkeypress=return check(event)/>;//樣式表禁用輸入法再過濾再數字字符還沒有禁用粘貼
rowinsertCell(rowcellslength)innerHTML=<input type=button onclick=return remove(this) value=移除/>;
}
var remove=function(obj) {
var tr=objparentNodeparentNode;
trparentNoderemoveChild(tr);
}
var initData=function() {
var tb=$(tab);
var data=[];
for(var i=;i<tbrowslength;i++) {
if(tbrows[i]cells[]firstChildvaluelength> && tbrows[i]cells[]firstChildvaluelength>) {//將兩個文本框裡值不為空的項添加到數組假設只有前兩列的數據不能為空
datapush(tbrows[i]cells[]firstChildvalue);
datapush(tbrows[i]cells[]firstChildvalue);
datapush(tbrows[i]cells[]firstChildvalue);
} //else {這裡可以給個提示說數據沒填完整是否提交否則return false}
}
$(HiddenField)value=datajoin(`);//使用這個比較不常用 的字符將數組拼接成字符串
return true;
};
//這裡可以增加一個方法判斷 hidden是否為空如果不為空獲取數據遍歷添加到表格中
// ></script>
</html>
後台獲取
代碼
using System;
using SystemConfiguration;
using SystemData;
using SystemLinq;
using SystemWeb;
using SystemWebSecurity;
using SystemWebUI;
using SystemWebUIHtmlControls;
using SystemWebUIWebControls;
using SystemWebUIWebControlsWebParts;
using SystemXmlLinq;
public partial class _Default : SystemWebUIPage
{
protected void Page_Load(object sender EventArgs e)
{
}
protected void Button_Click(object sender EventArgs e)
{
if (HiddenFieldValue != )
{
string[] datas = HiddenFieldValueSplit(`);
int i = ;
SystemCollectionsHashtable tb = new SystemCollectionsHashtable();
DataTable dt = new DataTable();//取出數據放進DataTable
dtColumnsAdd(Name typeof(string));
dtColumnsAdd(Content typeof(string));
dtColumnsAdd(Value typeof(int));
while (i < datasLength)
{
string str=datas[i];//這樣就取出數據了
string str = datas[i + ];
string str = datas[i + ];
int v = ;
intTryParse(str out v);
DataRow dr = dtNewRow();
dr[Name] = str;
dr[Content] = str;
dr[Value] = v;
dtRowsAdd(dr);
i += ;
}
ResponseWrite(數據行數為+dtRowsCount);
}
}
}
From:http://tw.wingwit.com/Article/program/net/201311/12247.html