在asp.net ajax 1.0中,如果有一個(gè)detailview控件,想做到每點(diǎn)detailview中的每行,在旁邊顯示出這條記錄的detail情況(master-detail的效果
的話),可以使用updatepanel控件實(shí)現(xiàn)
首先,
創(chuàng)建一個(gè)自定義web控件webusercontrol,ascx,把detailviw控件放到updatepanel控件內(nèi),detailview控件如下
<asp:UpdatePanel ID="UpdatePanel1" runat="server" >
<ContentTemplate>
<asp:Label ID="Label1" runat="server" Text="作者的詳細(xì)信息"></asp:Label><br />
<asp:DetailsView ID="DetailsView1" runat="server" AutoGenerateRows="False" DataKeyNames="au_id"
DataSourceID="SqlDataSource1" Height="50px" Width="438px">
<Fields>
<asp:BoundField DataField="au_id" HeaderText="au_id" ReadOnly="True" SortExpression="au_id" />
<asp:BoundField DataField="au_lname" HeaderText="au_lname" SortExpression="au_lname" />
<asp:BoundField DataField="au_fname" HeaderText="au_fname" SortExpression="au_fname" />
<asp:BoundField DataField="phone" HeaderText="phone" SortExpression="phone" />
<asp:BoundField DataField="address" HeaderText="address" SortExpression="address" />
<asp:BoundField DataField="city" HeaderText="city" SortExpression="city" />
<asp:BoundField DataField="state" HeaderText="state" SortExpression="state" />
<asp:BoundField DataField="zip" HeaderText="zip" SortExpression="zip" />
<asp:CheckBoxField DataField="contract" HeaderText="contract" SortExpression="contract" />
</Fields>
</asp:DetailsView>
<asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:pubsConnectionString %>"
SelectCommand="SELECT * FROM [authors] where
au_id=@authid">
<SelectParameters>
<asp:Parameter Name="authid" />
</SelectParameters> </asp:SqlDataSource>
</ContentTemplate>
</asp:UpdatePanel>
其中用的是pubs數(shù)據(jù)庫,這里用detailview控件根據(jù)主(master)gridview的author ID來顯示其詳細(xì)信息,
還要為此控件加兩個(gè)屬性和一個(gè)方法,
public partial class WebUserControl : System.Web.UI.UserControl
{
private string _authorID;
//定義主鍵屬性
public string AuthorID
{
get { return _authorID; }
set
{
_authorID = value;
this.SqlDataSource1.SelectParameters["authid"].DefaultValue = _authorID;
SqlDataSource1.DataBind(); }
}
//定義UpdatePanel的更新模式
public UpdatePanelUpdateMode UpdateMode
{
get { return this.UpdatePanel1.UpdateMode; }
set { this.UpdatePanel1.UpdateMode = value; }
}
//定義更新方法
public void Update()
{
//調(diào)用內(nèi)容方法
this.UpdatePanel1.Update();
}
}
然后在default.aspx中添加一個(gè)updatepanel和gridview,顯示所有的作者
<asp:ScriptManager ID="ScriptManager1" runat="server" />
<div>
<table style="width: 481px">
<tr>
<td style="width: 240px">
<asp:UpdatePanel ID="UpdatePanel1" runat="server"> <ContentTemplate>
<asp:GridView ID="GridView1" runat="server" AllowPaging="True" AutoGenerateColumns="False"
DataSourceID="SqlDataSource1" OnSelectedIndexChanged="GridView1_SelectedIndexChanged"
Width="243px" DataKeyNames="au_id">
<Columns>
<asp:CommandField ShowSelectButton="True" />
<asp:BoundField DataField="au_lname" HeaderText="au_lname" SortExpression="au_lname" />
<asp:BoundField DataField="au_fname" HeaderText="au_fname" SortExpression="au_fname" />
</Columns>
</asp:GridView>
<asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:pubsConnectionString %>"
SelectCommand="SELECT [au_lname], [au_fname], [au_id] FROM [authors]"></asp:SqlDataSource>
</ContentTemplate>
</asp:UpdatePanel> </td>
<td>
<uc1:WebUserControl id="WebUserControl1" runat="server">
</uc1:WebUserControl></td>
并且要寫gridview的selectedindexchanged事件,當(dāng)用戶選擇了某位作者后,可以馬上在webusercontrol控件中顯示出其詳細(xì)信息
protected void GridView1_SelectedIndexChanged(object sender, EventArgs e)
{
//判斷是否選中了GridView
if (GridView1.SelectedIndex == -1)
{
WebUserControl1.AuthorID = GridView1.DataKeys[0].Value.ToString();
}
else
{
WebUserControl1.AuthorID = GridView1.DataKeys[GridView1.SelectedIndex].Value.ToString();
}
//必須將更新控件的模式設(shè)置為"conditional"
WebUserControl1.UpdateMode = UpdatePanelUpdateMode.Conditional;
//更新數(shù)據(jù)
WebUserControl1.Update();
}