现在做后台需要这功能,请各位大侠指点一二!!!
你可以在數據加載完後看一下原代碼,GridView其實就是一個Table。你用AJAX技術得到數據後用JS做操作,我想應該是可行的。
這下面是我曾經找到的資料,也試驗過可以添加的,你試一下吧。
我用GridView試過,同樣也是可行的。
table.cells(5).innerText-->得到或設置表格中第6個單元格的值
table.rows(0).cells(0).innerText-->得到或設置表格第1行第1個單元格的值
//添加一行
var newTr = testTbl.insertRow();
//添加两列
var newTd0 = newTr.insertCell();
var newTd1 = newTr.insertCell();
//设置列内容和属性
newTd0.innerHTML = '<input type=checkbox id="box4">';
newTd2.innerText= '新加行';
deleteRow(1)-->刪除某行
newTd0.innerHTML = '<input type=checkbox id="box4" onClick="GetRow()">'; -->添加其他控件在單元格中
动态添加表格行 文/Ray
表格部分代码如下:
<table id="testTbl" border=1>
<tr id="tr1">
<td width=6%><input type=checkbox id="box1"></td>
<td id="b">第一行</td>
</tr>
<tr id="tr2">
<td width=6%><input type=checkbox id="box2"></td>
<td id="b">第二行</td>
</tr>
<tr bgcolor=#0000FF>
<td width=6%><input type=checkbox id="box3"></td>
<td>第三行</td>
</tr>
</table>
动态添加表行的javascript函数如下:
function addRow(){
//添加一行
var newTr = testTbl.insertRow();
//添加两列
var newTd0 = newTr.insertCell();
var newTd1 = newTr.insertCell();
//设置列内容和属性
newTd0.innerHTML = '<input type=checkbox id="box4">';
newTd2.innerText= '新加行';
}
就这么简单,做点详细的说明:
1、inserRow()和insertCell()函数
insertRow()函数可以带参数,形式如下:
insertRow(index)
这个函数将新行添加到index的那一行前,比如insertRow(0),是将新行添加到第一行之前。默认的insertRow()函数相当于insertRow(-1),将新行添加到表的最后。
insertCell()和insertRow的用法相同。
2、动态设置属性和事件
上面行数中的innerHTML和innerText都是列的属性。
这个inner,就是“inner”到<tb></tb>之间,innerText是添加到<tb></tb>之间的文本,innerHTML是添加到<tb></tb>之间的HTML代码(这个so简单,这个解释挺多余的)
设置其他属性也是用同样的方式,比如,设置行背景色
newTr.bgColor = 'red';
设置事件也一样,需要简单说明一点。
比如,我要让点击新加行的时候执行一个自己定义的函数 newClick,newClick行数如下:
function newClick(){
alert("这是新添加的行");
}
对onclick事件设置这个函数的代码如下:
newTr.onclick = newClick;