|
 |
栏目导栏 |
|
| |
|
|
|
|
|
资料搜索 |
|
| |
|
|
|
|
|
热门文章 |
|
| |
|
|
|
|
|
最新文章 |
|
| |
|
|
|
| |
| |
|
|
|
| |
| ASP.NET DEMO 15: 同时支持行单击和双击事件的 GridView/DataGr |
|
功能： x4rLinux联盟
单击行弹出当前行详细页面 x4rLinux联盟
双击行进入编辑状态（GridView/DataGrid内置 Edit） x4rLinux联盟
说明： x4rLinux联盟
单击事件（onclick）使用了 setTimeout 延迟，根据实际需要修改延迟时间 x4rLinux联盟
常见处理行方式会选择在 RowDataBound/ItemDataBound 中处理，这里我选择 Page.Render 中处理，至少基于以下考虑 x4rLinux联盟
RowDataBound 仅仅在调用 DataBind 之后才会触发，回发通过 ViewState 创建空件不触发 假如需要更多的处理，你需要分开部分逻辑到 RowCreated 等事件中 x4rLinux联盟
并且我们希望使用 ClientScript.GetPostBackEventReference 和 ClientScript.RegisterForEventValidation 方法 进行安全脚本的注册，而后者需要在页的 Render 阶段中才能处理 x4rLinux联盟
关于“DataGrid中采取的辅助按钮支持回发”见ASP.NET DEMO8: 为 GridView 每行添加服务器事件 x4rLinux联盟
PS：未实现 Edit 对应的 Update/Cancel ，根据需要自行添加即可。 x4rLinux联盟
x4rLinux联盟
原始需求：既有单击又有双击的ＧｒｉｄＶｉｅｗ是否存在（问了许多人都说不能，郁闷） x4rLinux联盟
x4rLinux联盟
x4rLinux联盟
可直接运行源码（单页 .aspx）： x4rLinux联盟
x4rLinux联盟
<%@ Page Language="C#" %> x4rLinux联盟
<%@ Import Namespace="System.Data" %> x4rLinux联盟
x4rLinux联盟
<%--http://community.csdn.net/Expert/TopicView3.asp?id=5767096--%> x4rLinux联盟
x4rLinux联盟
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> x4rLinux联盟
x4rLinux联盟
<script runat="server"> x4rLinux联盟
x4rLinux联盟
protected void Page_Load(object sender, EventArgs e) x4rLinux联盟
{ x4rLinux联盟
if (!IsPostBack) { x4rLinux联盟
LoadGridViewProductData(); x4rLinux联盟
LoadDataGridProductData(); x4rLinux联盟
} x4rLinux联盟
} x4rLinux联盟
x4rLinux联盟
protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e) x4rLinux联盟
{ x4rLinux联盟
/**//* x4rLinux联盟
当然可以在这里进行客户端脚本绑定， x4rLinux联盟
但是，我选择在重载页的 Render 方法中处理，因为 x4rLinux联盟
1. RowDataBound 仅仅在调用 DataBind 之后才会触发，回发通过 ViewState 创建空件不触发 x4rLinux联盟
假如需要更多的处理，你需要分开部分逻辑到 RowCreated 等事件中 x4rLinux联盟
2. 并且我们希望使用 x4rLinux联盟
ClientScript.GetPostBackEventReference 和 ClientScript.RegisterForEventValidation 方法 x4rLinux联盟
进行安全脚本的注册，而后者需要在页的 Render 阶段中才能处理 x4rLinux联盟
*/ x4rLinux联盟
} x4rLinux联盟
x4rLinux联盟
protected void DataGrid1_ItemDataBound(object sender, DataGridItemEventArgs e) x4rLinux联盟
{ x4rLinux联盟
// 隐藏辅助按钮列 x4rLinux联盟
int cellIndex = 0; x4rLinux联盟
e.Item.Cells[cellIndex].Attributes["style"] = "display:none"; x4rLinux联盟
} x4rLinux联盟
x4rLinux联盟
void LoadGridViewProductData() x4rLinux联盟
{ x4rLinux联盟
DataTable dt = CreateSampleProductData(); x4rLinux联盟
x4rLinux联盟
GridView1.DataSource = dt; x4rLinux联盟
GridView1.DataBind(); x4rLinux联盟
} x4rLinux联盟
x4rLinux联盟
void LoadDataGridProductData() x4rLinux联盟
{ x4rLinux联盟
DataTable dt = CreateSampleProductData(); x4rLinux联盟
x4rLinux联盟
DataGrid1.DataSource = dt; x4rLinux联盟
DataGrid1.DataBind(); x4rLinux联盟
} x4rLinux联盟
x4rLinux联盟
sample data#region sample data x4rLinux联盟
x4rLinux联盟
static DataTable CreateSampleProductData() x4rLinux联盟
{ x4rLinux联盟
DataTable tbl = new DataTable("Products"); x4rLinux联盟
x4rLinux联盟
tbl.Columns.Add("ProductID", typeof(int)); x4rLinux联盟
tbl.Columns.Add("ProductName", typeof(string)); x4rLinux联盟
tbl.Columns.Add("UnitPrice", typeof(decimal)); x4rLinux联盟
tbl.Columns.Add("CategoryID", typeof(int)); x4rLinux联盟
x4rLinux联盟
tbl.Rows.Add(1, "Chai", 18, 1); x4rLinux联盟
tbl.Rows.Add(2, "Chang", 19, 1); x4rLinux联盟
tbl.Rows.Add(3, "Aniseed Syrup", 10, 2); x4rLinux联盟
tbl.Rows.Add(4, "Chef Anton's Cajun Seasoning", 22, 2); x4rLinux联盟
tbl.Rows.Add(5, "Chef Anton's Gumbo Mix", 21.35, 2); x4rLinux联盟
tbl.Rows.Add(47, "Zaanse koeken", 9.5, 3); x4rLinux联盟
tbl.Rows.Add(48, "Chocolade", 12.75, 3); x4rLinux联盟
tbl.Rows.Add(49, "Maxilaku", 20, 3); x4rLinux联盟
x4rLinux联盟
return tbl; x4rLinux联盟
} x4rLinux联盟
x4rLinux联盟
#endregion x4rLinux联盟
x4rLinux联盟
protected void GridView1_RowEditing(object sender, GridViewEditEventArgs e) x4rLinux联盟
{ x4rLinux联盟
GridView1.EditIndex = e.NewEditIndex; x4rLinux联盟
LoadGridViewProductData(); x4rLinux联盟
} x4rLinux联盟
x4rLinux联盟
protected void DataGrid1_EditCommand(object source, DataGridCommandEventArgs e) x4rLinux联盟
{ x4rLinux联盟
DataGrid1.EditItemIndex = e.Item.ItemIndex; x4rLinux联盟
LoadDataGridProductData(); x4rLinux联盟
} x4rLinux联盟
x4rLinux联盟
protected override void Render(HtmlTextWriter writer) x4rLinux联盟
{ x4rLinux联盟
// GridView x4rLinux联盟
foreach (GridViewRow row in GridView1.Rows) { x4rLinux联盟
if (row.RowState == DataControlRowState.Edit) { // 编辑状态 x4rLinux联盟
row.Attributes.Remove("onclick"); x4rLinux联盟
row.Attributes.Remove("ondblclick"); x4rLinux联盟
row.Attributes.Remove("style"); x4rLinux联盟
row.Attributes["title"] = "编辑行"; x4rLinux联盟
continue; x4rLinux联盟
} x4rLinux联盟
if (row.RowType == DataControlRowType.DataRow) { x4rLinux联盟
//单击事件，为了响应双击事件，延迟 1 s，根据需要可能需要增加延迟 x4rLinux联盟
row.Attributes["onclick"] = String.Format("javascript:setTimeout(\"window.open('DummyProductDetail.aspx?productid={0}')\", 1000*1);event.cancelBubble=true;", GridView1.DataKeys[row.RowIndex].Value.ToString()); x4rLinux联盟
// 获取ASP.NET内置回发脚本函数，返回 __doPostBack(<<EventTarget>>, <<EventArgument>>) x4rLinux联盟
// 可直接硬编码写入脚本，不推荐 x4rLinux联盟
row.Attributes["ondblclick"] = ClientScript.GetPostBackEventReference(GridView1, "Edit$" + row.RowIndex.ToString(), true); x4rLinux联盟
// x4rLinux联盟
row.Attributes["style"] = "cursor:pointer"; x4rLinux联盟
row.Attributes["title"] = "单击打开详细页面、双击进入编辑"; x4rLinux联盟
} x4rLinux联盟
} x4rLinux联盟
x4rLinux联盟
// DataGrid x4rLinux联盟
foreach (DataGridItem item in DataGrid1.Items) { x4rLinux联盟
if (item.ItemType == ListItemType.EditItem) { x4rLinux联盟
item.Attributes.Remove("onclick"); x4rLinux联盟
item.Attributes.Remove("ondblclick"); x4rLinux联盟
item.Attributes.Remove("style"); x4rLinux联盟
item.Attributes["title"] = "编辑行"; x4rLinux联盟
continue; x4rLinux联盟
} x4rLinux联盟
if (item.ItemType == ListItemType.Item || item.ItemType == ListItemType.AlternatingItem) { x4rLinux联盟
//单击事件，为了响应双击事件，延迟 1 s，根据需要可能需要增加延迟 x4rLinux联盟
item.Attributes["onclick"] = String.Format("javascript:setTimeout(\"window.open('DummyProductDetail.aspx?productid={0}')\", 1000*1);event.cancelBubble=true;", DataGrid1.DataKeys[item.ItemIndex].ToString()); x4rLinux联盟
// 双击 x4rLinux联盟
// 获取辅助的支持回发按钮 x4rLinux联盟
// 相对而言， GridView 支持直接将 CommandName 作为 <<EventArgument>> 故不需要辅助按钮 x4rLinux联盟
Button btnHiddenPostButton = item.FindControl("btnHiddenPostButton") as Button; x4rLinux联盟
// 获取ASP.NET内置回发脚本函数，返回 __doPostBack(<<EventTarget>>, <<EventArgument>>) x4rLinux联盟
// 可直接硬编码写入脚本，不推荐 x4rLinux联盟
item.Attributes["ondblclick"] = ClientScript.GetPostBackEventReference(btnHiddenPostButton, ""); x4rLinux联盟
// x4rLinux联盟
item.Attributes["style"] = "cursor:pointer"; x4rLinux联盟
item.Attributes["title"] = "单击打开详细页面、双击进入编辑"; x4rLinux联盟
} x4rLinux联盟
} x4rLinux联盟
x4rLinux联盟
base.Render(writer); x4rLinux联盟
} x4rLinux联盟
</script> x4rLinux联盟
x4rLinux联盟
<html xmlns="http://www.w3.org/1999/xhtml" > x4rLinux联盟
<head id="Head1" runat="server"> x4rLinux联盟
<title>ASP.NET DEMO15: GridView 行单击与双击事件</title> x4rLinux联盟
</head> x4rLinux联盟
<body> x4rLinux联盟
<form id="form1" runat="server"> x4rLinux联盟
<div> x4rLinux联盟
<h3>功能：</h3> x4rLinux联盟
<li>单击弹出当前详细页面</li> x4rLinux联盟
<li>双击进入编辑状态（GridView/DataGrid内置 Edit）</li> x4rLinux联盟
<h3>说明：</h3> x4rLinux联盟
<li>单击事件（onclick）使用了 setTimeout 延迟，根据实际需要修改延迟时间</li> x4rLinux联盟
<li>常见处理行方式会选择在 RowDataBound/ItemDataBound 中处理，这里我选择 Page.Render 中处理，至少基于以下考虑 x4rLinux联盟
<li style="padding-left:20px; list-style-type:square">RowDataBound 仅仅在调用 DataBind 之后才会触发，回发通过 ViewState 创建空件不触发 x4rLinux联盟
假如需要更多的处理，你需要分开部分逻辑到 RowCreated 等事件中</li> x4rLinux联盟
<li style="padding-left:20px; list-style-type:square">并且我们希望使用 x4rLinux联盟
ClientScript.GetPostBackEventReference 和 ClientScript.RegisterForEventValidation 方法 x4rLinux联盟
进行安全脚本的注册，而后者需要在页的 Render 阶段中才能处理</li> x4rLinux联盟
</li> x4rLinux联盟
<li>关于“DataGrid中采取的辅助按钮支持回发”见<a href=http://www.cnblogs.com/Jinglecat/archive/2007/07/15/818394.htmlx4rLinux联盟
>ASP.NET DEMO8: 为 GridView 每行添加服务器事件</a> x4rLinux联盟
<br /> x4rLinux联盟
<input type="button" id="Button1" value="Rebind" onclick="location.href=location.href;" /> x4rLinux联盟
<div style="float:left"> x4rLinux联盟
<h3>GridView Version</h3> x4rLinux联盟
<asp:GridView ID="GridView1" DataKeyNames="ProductID" runat="server" AutoGenerateColumns="False" OnRowEditing="GridView1_RowEditing" OnRowDataBound="GridView1_RowDataBound"> x4rLinux联盟
<Columns> x4rLinux联盟
<asp:TemplateField HeaderText="ProductName" > x4rLinux联盟
<ItemTemplate> x4rLinux联盟
<%# Eval("ProductName") %> x4rLinux联盟
</ItemTemplate> x4rLinux联盟
<EditItemTemplate> x4rLinux联盟
<asp:TextBox ID="txtProductName" runat="server" Text='<%# Bind("ProductName") %>' /> x4rLinux联盟
</EditItemTemplate> x4rLinux联盟
</asp:TemplateField> x4rLinux联盟
<asp:BoundField DataField="UnitPrice" HeaderText="UnitPrice" /> x4rLinux联盟
x4rLinux联盟
</Columns> x4rLinux联盟
</asp:GridView></div> x4rLinux联盟
<div style="float:left;padding-left:100px;"> x4rLinux联盟
<h3>DataGrid Version</h3> x4rLinux联盟
<asp:DataGrid ID="DataGrid1" DataKeyField="ProductID" runat="server" AutoGenerateColumns="False" OnEditCommand="DataGrid1_EditCommand" OnItemDataBound="DataGrid1_ItemDataBound"> x4rLinux联盟
<Columns> x4rLinux联盟
<asp:TemplateColumn> x4rLinux联盟
<ItemTemplate> x4rLinux联盟
<asp:Button ID="btnHiddenPostButton" CommandName="Edit" runat="server" Text="HiddenPostButton" style="display:none" /> x4rLinux联盟
</ItemTemplate> x4rLinux联盟
</asp:TemplateColumn> x4rLinux联盟
<asp:BoundColumn DataField="ProductName" HeaderText="ProductName" /> x4rLinux联盟
<asp:BoundColumn DataField="UnitPrice" HeaderText="UnitPrice" /> x4rLinux联盟
</Columns> x4rLinux联盟
</asp:DataGrid></div> x4rLinux联盟
</li> x4rLinux联盟
</div> x4rLinux联盟
</form> x4rLinux联盟
</body> x4rLinux联盟
</html> x4rLinux联盟
x4rLinux联盟
x4rLinux联盟
效果： x4rLinux联盟
Linux联盟收集整理 ,转贴请标明原始链接,如有任何疑问欢迎来本站Linux论坛讨论 |
|
|
|
|
|
