asp.net ajax技巧-主從gridview動態(tài)更新

悟靜 2012-04-30

展開全文

下面是異步的一對多流程，有兩個gridview，上面一個gridview是主，下面一個GRIDVIEW顯示的是從，當(dāng)點
主表的數(shù)據(jù)時，下面的GRIDVIEW顯示對應(yīng)的數(shù)據(jù)（DETAIL），要注意的是，為了防止浪費時間，把兩個GRIDVIEW
放到兩個不同的updatepannel中去，并且設(shè)計兩個UPDATEPANNEL控件的updatemode屬性為conditional,這樣當(dāng)在下方的GRIDVIEW控件排序時，上方的UPDATEPANNEL控件不會被局部更新
<asp:ScriptManager ID="ScriptManager1" runat="server" />
 <asp:UpdatePanel ID="OrdersPanel" UpdateMode="Conditional" runat="server">
 <ContentTemplate>
 <asp:GridView ID="GridView1" AllowPaging="True" AllowSorting="True" Caption="訂貨主檔的訂單數(shù)據(jù)"
 DataKeyNames="訂單號碼" DataSourceID="SqlDataSource1" OnSelectedIndexChanged="GridView1_SelectedIndexChanged"
 runat="server" Width="608px" BackColor="LightGoldenrodYellow" BorderColor="Tan"
 BorderWidth="1px" CellPadding="2" ForeColor="Black" GridLines="None" SelectedIndex="0"
 OnPageIndexChanged="GridView1_PageIndexChanged">
 <Columns>
 <asp:CommandField ShowSelectButton="True"></asp:CommandField>
 </Columns>
 <FooterStyle BackColor="Tan" />
 <SelectedRowStyle BackColor="DarkSlateBlue" ForeColor="GhostWhite" />
 <PagerStyle BackColor="PaleGoldenrod" ForeColor="DarkSlateBlue" HorizontalAlign="Center" />
 <HeaderStyle BackColor="Tan" Font-Bold="True" />
 <AlternatingRowStyle BackColor="PaleGoldenrod" />
 </asp:GridView>
 <asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:chtNorthwind %>"
 SelectCommand="SELECT 訂單號碼,客戶編號,員工編號,訂單日期 FROM dbo.訂貨主檔"></asp:SqlDataSource>
 </ContentTemplate>
 </asp:UpdatePanel>
 
 <asp:UpdatePanel ID="OrderDetailsPanel" UpdateMode="Conditional" runat="server">
 <ContentTemplate>
 <asp:GridView ID="GridView2" runat="server" BackColor="White" BorderColor="#E7E7FF"
 BorderStyle="None" BorderWidth="1px" Caption="訂貨明細(xì)資料" CellPadding="3" DataKeyNames="訂單號碼,產(chǎn)品編號"
 DataSourceID="SqlDataSource2" GridLines="Horizontal" Width="608px" AllowSorting="True">
 <FooterStyle BackColor="#B5C7DE" ForeColor="#4A3C8C" />
 <RowStyle BackColor="#E7E7FF" ForeColor="#4A3C8C" />
 <SelectedRowStyle BackColor="#738A9C" Font-Bold="True" ForeColor="#F7F7F7" />
 <PagerStyle BackColor="#E7E7FF" ForeColor="#4A3C8C" HorizontalAlign="Right" />
 <HeaderStyle BackColor="#4A3C8C" Font-Bold="True" ForeColor="#F7F7F7" />
 <AlternatingRowStyle BackColor="#F7F7F7" />
 <EmptyDataTemplate>
 請您從以上的清單中選取一筆訂單.....
 </EmptyDataTemplate>
 <EmptyDataRowStyle BackColor="#404040" ForeColor="Red" />
 </asp:GridView>
 
 <asp:SqlDataSource ID="SqlDataSource2" ConnectionString="<%$ ConnectionStrings:chtNorthwind %>"
 SelectCommand="SELECT 訂單號碼,產(chǎn)品編號,單價,數(shù)量,折扣 FROM dbo.訂貨明細(xì) WHERE (訂單號碼 = @OrderID)"
 runat="server">
 <SelectParameters>
 <asp:ControlParameter ControlID="GridView1" Name="OrderID" PropertyName="SelectedValue"
 Type="Int32" />
 </SelectParameters>
 </asp:SqlDataSource>
 </ContentTemplate>
 <Triggers>
 <asp:AsyncPostBackTrigger ControlID="GridView1" EventName="SelectedIndexChanged" />
 <asp:AsyncPostBackTrigger ControlID="GridView1" EventName="PageIndexChanged" />
 <asp:AsyncPostBackTrigger ControlID="GridView1" EventName="Sorted" />
 </Triggers>
 </asp:UpdatePanel>