知足常乐,享受生活。
当你有一个DataGrid控件,而且DataGrid允许用户删除网格(grid)中的一行时,你不需要某些客户端代码,你只需要点击网格上的Delete按钮就可以删除行了,但是删除时不会提示用户进行确认。这时Attributes属性就派得上用场了。你可以用DataGrid的ItemDataBound()服务器事件给网格中的每个删除按钮添加一个属性。当你用DataGrid的DataBind方法将数据绑定到网格时,所添加的每一行都会触发ItemDataBound事件。在事件中添加的代码如下:
Private Sub MyDataGrid_ItemDataBound(ByVal _ Sender as object, ByVal e As _ System.Web.UI.WebControls. _ DataGridItemEventArgs) _ Handles MyDataGrid.ItemDataBound ' This code adds javascript to the "Del" ' button on each row in ' the datagrid the javascript displays a ' message box to the ' user, confirming the delete action Dim btnDel As LinkButton Const DEL_COLUMN As Int16 = 1 If Not (e.Item.ItemType = _ ListItemType.Header Or _ e.Item.ItemType = _ ListItemType.Footer) Then btnDel = _ e.Item.Cells(DEL_COLUMN).Controls(0) btnDel.Attributes.Add("onClick", _ "confirmDelete();") End If End Sub
有一点,在DataGrid.ItemCreated事件里取不到control的正确的Client ID或Unique ID,老是返回“TextBox1”,弄得client side script很难写……而在DataGrid.ItemDataBound事件里就能取到“DataGrid1__ctl2_TextBox1”……未及深究,不知道有没有人能给个solid的解释……
The following two pages will demonstrate how to use client side "window.showModalWindow" in combination with ASP.Net server side PostBack.
=======================WebForm1.aspx=========================
<%@ Page language="c#" AutoEventWireup="true" %><%@ Import Namespace="System.Data" %><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" ><HTML> <HEAD> <title>WebForm1</title> </HEAD> <body MS_POSITIONING="GridLayout"> <form id="Form1" method="post" runat="server"> <asp:DataGrid id="DataGrid1" style="Z-INDEX: 101; LEFT: 56px; POSITION: absolute; TOP: 48px" runat="server" Width="512px" Height="256px" AutoGenerateColumns="False"> <Columns> <asp:BoundColumn DataField="StringColumn" HeaderText="StringColumn"></asp:BoundColumn> <asp:TemplateColumn HeaderText="DateColumn"> <ItemTemplate> <asp:TextBox id=TextBox1 runat="server" Text='<%# DateTime.Parse(DataBinder.Eval(Container, "DataItem.DateColumn").ToString()).ToShortDateString() %>'> </asp:TextBox> <asp:Button id="Button1" runat="server" Text="Edit Value"></asp:Button> </ItemTemplate> </asp:TemplateColumn> </Columns> </asp:DataGrid> </form> <script runat="server"> protected DataTable dt; protected void Page_Load(object sender, System.EventArgs e) { DataGrid1.ItemDataBound += new System.Web.UI.WebControls.DataGridItemEventHandler(this.DataGrid1_ItemDataBound); dt = new DataTable("TestTable"); dt.Columns.Add("StringColumn",typeof(string)); dt.Columns.Add("DateColumn",typeof(DateTime)); dt.Rows.Add(new object[]{"String 1",DateTime.Now}); dt.Rows.Add(new object[]{"String 2",DateTime.Now}); DataGrid1.DataSource = dt; DataGrid1.DataBind(); } protected void DataGrid1_ItemDataBound(object sender, System.Web.UI.WebControls.DataGridItemEventArgs e) { //Eliminate the headers and footers. if (e.Item.Cells[1].Controls.Count == 5) { TextBox tx = (TextBox)e.Item.Cells[1].Controls[1]; Button btn = (Button)e.Item.Cells[1].Controls[3]; btn.Attributes.Add("onclick","return buttonClick('" + tx.ClientID + "');"); } } </script> <script language="javascript"> function buttonClick(senderTextBoxID) { //debugger; var i; var senderTextBox; for (i = 0; i < event.srcElement.parentElement.children.length; i++) { if (event.srcElement.parentElement.children[i].id == senderTextBoxID) { senderTextBox = event.srcElement.parentElement.children[i]; } } var returnValue; returnValue = window.showModalDialog("CalendarDialog.aspx?selectedDate=" + senderTextBox.value); //debugger; if (returnValue != null) { senderTextBox.value = returnValue.toString(); } //Cancel the postback. return false; } </script> </body></HTML>
=======================CalendarDialog.aspx=========================
<%@ Page language="c#" AutoEventWireup="true"%><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" ><HTML> <HEAD> <title>CalendarDialog</title> <base target=_self> </HEAD> <body MS_POSITIONING="GridLayout"> <form id="Form1" method="post" runat="server"> <asp:Calendar id="Calendar1" style="Z-INDEX: 101; LEFT: 32px; POSITION: absolute; TOP: 32px" runat="server" Width="241px" Height="176px"></asp:Calendar> <INPUT style="Z-INDEX: 102; LEFT: 32px; WIDTH: 96px; POSITION: absolute; TOP: 224px; HEIGHT: 24px" type="button" value="OK" onclick="returnToMainForm();"> <INPUT style="Z-INDEX: 103; LEFT: 176px; WIDTH: 96px; POSITION: absolute; TOP: 224px; HEIGHT: 24px" type="button" value="Cancel" onclick="window.close();"> </form> <script runat=server> protected void Page_Load(object sender, System.EventArgs e) { if (!IsPostBack) { DateTime dt; try { dt = DateTime.Parse(Request.QueryString["selectedDate"]); } catch { dt = DateTime.Now; } Calendar1.SelectedDate = dt; RegisterHiddenField("selectedDate",dt.ToShortDateString()); } Calendar1.SelectionChanged += new EventHandler(Calendar1_SelectionChanged); }
protected void Calendar1_SelectionChanged(object sender, System.EventArgs e) { RegisterHiddenField("selectedDate",this.Calendar1.SelectedDate.ToShortDateString()); } </script> <script language=javascript> function returnToMainForm() { window.returnValue = window.Form1.selectedDate.value; window.close(); } </script> </body></HTML>