怎么創(chuàng)建一個(gè)用彈出窗口來(lái)查看詳細(xì)信息的超鏈接列
發(fā)表時(shí)間：2023-08-18 來(lái)源：明輝站整理相關(guān)軟件相關(guān)文章人氣：
[摘要]FCloud（翻譯） 出處：www.dotnetjunkie.com 這篇文章來(lái)自于一位忠實(shí)的DotNetJunkie的建議，他最初發(fā)了一封email給我們，要求我們給出一個(gè)例子來(lái)說(shuō)明如何...
FCloud（翻譯）
出處：www.dotnetjunkie.com
這篇文章來(lái)自于一位忠實(shí)的DotNetJunkie的建議，他最初發(fā)了一封email給我們，
要求我們給出一個(gè)例子來(lái)說(shuō)明如何在DataGrid中設(shè)置一個(gè)當(dāng)用戶(hù)點(diǎn)擊時(shí)能夠彈出
顯示其詳細(xì)信息的新窗口的超鏈接列。在我們給他回復(fù)之前，他已經(jīng)給我們提供了
一種方法，并建議我們寫(xiě)篇教程。于是有了這篇文章。這篇文章包含了兩個(gè)webforms和一個(gè)css第一個(gè)webform包含了一個(gè)DataGrid，它顯示了Northwind數(shù)據(jù)庫(kù)中的一列產(chǎn)品還有寫(xiě)著"SeeDetails"的超鏈接。只要點(diǎn)擊了這個(gè)鏈接，就會(huì)調(diào)用JavaScript的Window.Open方法來(lái)打開(kāi)一個(gè)新的窗口。在一個(gè)Url中包含了用戶(hù)想詳細(xì)了解的產(chǎn)品的ProductId的Query String 參數(shù)。在第二個(gè)Webform里，是另一個(gè)DataGrid，它顯示了用戶(hù)選擇的產(chǎn)品的所有詳細(xì)信息。現(xiàn)在讓我們來(lái)看看WebForm1.aspx和WebForm1.aspx.cs。
WebForm1.aspx
<%@ Page language="c#" AutoEventWireup="false" Inherits="HowTos.DataGrid.PopupWindow.WebForm1" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
<HTML>
<head>
<LINK REL="stylesheet" TYPE="text/css" HREF="StyleSheet1.css"></LINK>
</head>
<body>
<center>
<form runat="server" ID="Form1">
<asp:datagrid id="DataGrid1" runat="server" Font-Size="12" AutoGenerateColumns="False">
<Columns>
<asp:BoundColumn DataField= "ProductID" HeaderText= "Product ID" HeaderStyle-CssClass="HEADERSTYLE" ItemStyle-CssClass="ITEMSTYLEDEFAULT" />
<asp:BoundColumn DataField="ProductName" HeaderText="ProductName" HeaderStyle-CssClass="HEADERSTYLE" ItemStyle-CssClass="ITEMSTYLEDEFAULT"/>
<asp:hyperlinkcolumn DataTextFormatString="ShowDetails..." DataTextField="ProductID" DataNavigateUrlField="ProductID" DataNavigateUrlFormatString="
javascript:varwin=window.open('WebForm2.aspx?ProductID={0}',null,'width=692,height=25');" HeaderText="See Details" HeaderStyle-CssClass="HEADERSTYLE" ItemStyle-CssClass="ITEMSTYLEHYPERLINK" />
</Columns>
</asp:datagrid>
</form>
</center>
</body>
</HTML>
WebForm1.aspx.cs
using System;
using System.Collections;
using System.ComponentModel;
using System.Data;
using System.Data.SqlClient ;
using System.Drawing;
using System.Web;
using System.Web.SessionState;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.HtmlControls;
namespace HowTos.DataGrid.PopupWindow
{
public class WebForm1 : System.Web.UI.Page
{
protected System.Web.UI.WebControls.DataGrid DataGrid1;
#region User Defined Code
private void Page_Load(object sender, System.EventArgs e)
{
if ( ! this.IsPostBack )
this.BindData();
}
protected void BindData()
{
SqlCommand cmd = new SqlCommand( "SELECT TOP 10 ProductID, ProductName FROM Products", con("Server=LocalHost; DataBase=Northwind; TRUSTED_CONNECTION=TRUE"));
this.DataGrid1.DataSource = cmd.ExecuteReader(CommandBehavior.CloseConnection);
this.DataGrid1.DataBind();
}
protected SqlConnection con(System.String ConnectionString )
{
SqlConnection c = new SqlConnection( ConnectionString );
c.Open();
return c;
}
#endregion
#region Web Form Designer generated code
override protected void OnInit(EventArgs e)
{
InitializeComponent();
base.OnInit(e);
}
private void InitializeComponent()
{
this.Load += new System.EventHandler(this.Page_Load);
}
#endregion
}
}
其實(shí)這兩個(gè)文件沒(méi)有什么難點(diǎn)，除了DataNavigateUrlFormatString,你注意到我直接把JavaScript window.open寫(xiě)在里面（注意：我也可以建一個(gè)js文件或者在WebForm中使用<script></script>，我直接寫(xiě)是為了簡(jiǎn)單）這個(gè)Javascript代碼應(yīng)該對(duì)大家來(lái)說(shuō)很熟悉，所以我也不深入討論它。它的作用就是在新窗口中打開(kāi)WebForm2.aspx使用ProductId參數(shù)。這個(gè)值是來(lái)自我們的數(shù)據(jù)源。我們來(lái)看看webform2.aspx和webform2.aspx.cs。
WebForm2.aspx
<%@Page language="c#" AutoEventWireup="false" Inherits="HowTos.DataGrid.PopupWindow.WebForm2" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
<html>
<head>
<title>Product Details</title>
<LINK REL="stylesheet" TYPE="text/css" HREF="StyleSheet1.css"></LINK>
</head>
<body>
<asp:DataGrid HeaderStyle-CssClass="HEADERSTYLE" ItemStyle-CssClass="ITEMSTYLEDEFAULT" runat="server" id="DataGrid1" Font-Size="8" Height="50" Width="675"></asp:DataGrid>
<p align="center">
<a href="
javascript:window.close()">close window</a>
</p>
</body>
</html>
WebForm2.aspx.cs
using System;
using System.Collections;
using System.ComponentModel;
using System.Data;
using System.Data.SqlClient ;
using System.Drawing;
using System.Web;
using System.Web.SessionState;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.HtmlControls;
namespace HowTos.DataGrid.PopupWindow
{
public class WebForm2 : System.Web.UI.Page
{
protected System.Web.UI.WebControls.DataGrid DataGrid1;
#region User Defined Code
private void Page_Load(object sender, System.EventArgs e)
{
if ( ! this.IsPostBack )
this.BindData();
}
protected void BindData()
{
SqlCommand cmd = new SqlCommand( "SELECT * FROM Products WHERE ProductID = @ProductID", con("Server=LocalHost; DataBase=Northwind; TRUSTED_CONNECTION=TRUE"));
cmd.Parameters.Add(new SqlParameter("@ProductID", SqlDbType.VarChar, 200));
cmd.Parameters["@ProductID"].Value = Request["ProductID"].ToString();
this.DataGrid1.DataSource = cmd.ExecuteReader(CommandBehavior.CloseConnection);
this.DataGrid1.DataBind();
}
protected SqlConnection con(System.String ConnectionString )
{
SqlConnection c = new SqlConnection( ConnectionString );
c.Open();
return c;
}
#endregion
#region Web Form Designer generated code
override protected void OnInit(EventArgs e)
{
InitializeComponent();
base.OnInit(e);
}
private void InitializeComponent()
{
this.Load += new System.EventHandler(this.Page_Load);
}
#endregion
}
}
webform2.aspx也是相當(dāng)?shù)暮?jiǎn)單。其中只有一個(gè)綁定到SqlDataReader的DataGrid。SqlDataReader通過(guò)Query string參數(shù)獲得產(chǎn)品的數(shù)據(jù)。
