前台代码
<div>
<asp:LinkButton ID="lbtnAddRow" runat="server" Width="80px" OnClick="lbtnAddRow_Click">添加行</asp:LinkButton>
<asp:LinkButton ID="btnDeleteRow" runat="server" OnClick="btnDeleteRow_Click" OnClientClick="return confirm('确定要删除选中行吗?');">删除选中行</asp:LinkButton>
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" CellPadding="4">
<EmptyDataTemplate>
<table>
<tr>
<th>
ID
</th>
<th>
序号
</th>
<th>
<input id="empCheck" type="checkbox" onclick="SelectAll(this)" />
</th>
<th>
工号
</th>
<th>
姓名
</th>
</tr>
</table>
</EmptyDataTemplate>
<Columns>
<asp:TemplateField HeaderText="ID">
<ItemTemplate>
<asp:Label ID="lblID" runat="server" Text='<%#Eval("ID") %>'></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="序号">
<ItemTemplate>
<%# Container.DataItemIndex + 1%>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField>
<HeaderTemplate>
<input id="chkAll" type="checkbox" onclick="SelectAll(this)" />
</HeaderTemplate>
<ItemTemplate>
<input id="chkRow" type="checkbox" onclick="checkRow(this);" runat="server" />
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="工号">
<ItemTemplate>
<asp:TextBox ID="txtEmpNo" runat="server" Text='<%# Eval("myemp_no") %>' BorderStyle="None"></asp:TextBox>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="姓名">
<ItemTemplate>
<asp:TextBox ID="txtName" runat="server" Text='<%# Eval("myname") %>' BorderStyle="None"></asp:TextBox>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
</div>
//选中所有行
function SelectAll(chkAll)
{
var gridview =$("table[id$='GridView1']")[0];
if (gridview)
{
//获取到GridView1中的所有input标签
var inputs = gridview.getElementsByTagName("input");
for(var i=0;i<inputs.length;i++)
{
if (inputs[i].type=="checkbox")
{
//设置所有checkbox的选中状态与chkAll一致
inputs[i].checked = chkAll.checked;
}
}
}
}
//给选中行换背景色
function checkRow(chkRow)
{
var row = chkRow.parentNode.parentNode;
if(row)
{
if (chkRow.checked)
{
row.style.backgroundColor="#7799CC";
}
else
{
row.style.backgroundColor="#FFFFFF";
}
}
}
/// <summary>
/// 初始化数据
/// </summary>
public void InitGridData()
{
DataTable dt = bll.GetGridViewData();
GridView1.DataSource = dt;
GridView1.DataBind();
}
/// <summary>
/// 添加行
/// </summary>
/// <param name="sender"></param>
/// <param name="e"></param>
protected void lbtnAddRow_Click(object sender, EventArgs e)
{
DataTable table = GetGridViewData();
DataRow newRow = table.NewRow();
newRow["ID"] = Guid.NewGuid().ToString();
table.Rows.Add(newRow);
GridView1.DataSource = table;
GridView1.DataBind();
int count = this.GridView1.Rows.Count;
((HtmlInputCheckBox)(this.GridView1.Rows[count - 1].FindControl("chkRow"))).Checked = true;
this.GridView1.Rows[count - 1].BackColor = System.Drawing.ColorTranslator.FromHtml("#7799CC");
}
/// <summary>
/// 获取gridview数据转换成table
/// </summary>
/// <returns></returns>
private DataTable GetGridViewData()
{
DataTable table = new DataTable();
table.Columns.Add(new DataColumn("id"));
table.Columns.Add(new DataColumn("myemp_no"));
table.Columns.Add(new DataColumn("myname"));
foreach (GridViewRow row in GridView1.Rows)
{
DataRow sourseRow = table.NewRow();
sourseRow["id"] = ((Label)(row.FindControl("lblID"))).Text;
sourseRow["myemp_no"] = ((TextBox)row.FindControl("txtEmpNo")).Text;
sourseRow["myname"] = ((TextBox)row.FindControl("txtName")).Text;
table.Rows.Add(sourseRow);
}
return table;
}
/// <summary>
/// 删除
/// </summary>
/// <param name="sender"></param>
/// <param name="e"></param>
protected void btnDeleteRow_Click(object sender, EventArgs e)
{
DataTable table = GetGridViewData();
foreach (GridViewRow row in GridView1.Rows)
{
if (((HtmlInputCheckBox)row.FindControl("chkRow")).Checked)
{
foreach (DataRow dtRow in table.Rows)
{
if (dtRow["ID"].ToString() ==((Label)(row.FindControl("lblID"))).Text)
{
table.Rows.Remove(dtRow);
break;
}
}
}
}
GridView1.DataSource = table;
GridView1.DataBind();
}