[ASP.NET] showModalDialog Sample Code

  • 4279
  • 0

[ASP.NET] showModalDialog Sample Code

源自:

小鋪上的一則發問

『Double Click 在A頁面上GridView裡的TextBox,Open showModalDialog視窗

提供選取值後,再回填A頁面GridView裡的TextBox』

 

範例程式碼

[Page A ]

利用Url將觸發showModalDialog的物件Client ID傳給showModalDialog視窗,如

範例中的source參數,此外showModalDialog第二個參數vArguments給予self,表示

傳入A視窗

<asp:SqlDataSource ID="SqlDataSource1" runat="server" 
    ConnectionString="<%$ ConnectionStrings:DBconnStr %>" 
    SelectCommand="SELECT [code], [name] FROM [bank]"></asp:SqlDataSource>
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" 
    DataSourceID="SqlDataSource1" onrowdatabound="GridView1_RowDataBound">
    <Columns>
        <asp:BoundField DataField="code" HeaderText="code" SortExpression="code" />
        <asp:BoundField DataField="name" HeaderText="name" SortExpression="name" />
        <asp:TemplateField>
            <ItemTemplate>
                <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
            </ItemTemplate>
        </asp:TemplateField>
    </Columns>
</asp:GridView>
public partial class ShowModalDialog : System.Web.UI.Page
{
	protected void Page_Load(object sender, EventArgs e)
	{
	
	}
	
	protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
	{
	    if (e.Row.RowType == DataControlRowType.DataRow)
	    {
	        TextBox tb = e.Row.FindControl("TextBox1") as TextBox;
	        if (tb != null)
	            tb.Attributes.Add("ondblclick", "showModalDialog('ShowModalDialog2.aspx?source=" + tb.ClientID + "',self,'dialogWidth:650px;dialogHeight:450px;');");
	    }
	}
}

 

[Page B]

由於我們已經利用showModalDialog第二個參數vArguments及Url中的source參數

,因此再以window.dialogArguments.document.getElementById 即可把值填回A

頁面中,如範例中的returnval function

<asp:SqlDataSource ID="SqlDataSource1" runat="server" 
    ConnectionString="<%$ ConnectionStrings:DBconnStr %>" 
    SelectCommand="SELECT [name] FROM [city]"></asp:SqlDataSource>
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" 
    DataSourceID="SqlDataSource1" 
    onrowdatabound="GridView1_RowDataBound" >
    <Columns>
        <asp:BoundField DataField="name" HeaderText="name" SortExpression="name" />
        <asp:TemplateField>
            <ItemTemplate>
                <asp:Button ID="Button1" runat="server" Text="選取" UseSubmitBehavior="False" />
            </ItemTemplate>
        </asp:TemplateField>
    </Columns>
</asp:GridView>

 

protected void Page_Load(object sender, EventArgs e)
{
    string js= @"function returnval(objid, objval) {
                window.dialogArguments.document.getElementById(objid).value = objval;
                window.close();
            }";
    Page.ClientScript.RegisterClientScriptBlock(this.GetType(),"js",js,true);
}


protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
{
    if (e.Row.RowType == DataControlRowType.DataRow)
    {
        Button bt = e.Row.FindControl("Button1") as Button;
        if (bt != null)
            bt.Attributes.Add("onclick", "returnval('" + Request.QueryString["source"].ToString() + "','" + e.Row.Cells[0].Text + "');");
    }
}

 

相關資源:

showModalDialog Method

 

若本文對您有所幫助,歡迎轉貼,但請在加註【轉貼】及來源出處,並在附上本篇的超連結,感恩您的配合囉。

By No.18