我做的是一個類似大腸包小腸的留言版功能--
外圍的 (大)GridView1,連結主要的資料表1
內部的 (小)GridView2,連結主要的資料表2
1). 當我在 (大)GridView1點選某一篇文章的時候,
2). 裡面的 (小)GridView2就會出現這篇文章的相關留言。
[習題] [主細表]Gridview內部的「子控制項」,搭配不同SqlDataSource
這個補充的習題,用來回答讀者的疑問。
可以當成書本(上集)的第七~第十章的後續補充。
新出版的「ASP.NET 4.0專題實務 I -- 入門實戰篇 / 松崗出版」,把這些相關範例歸納在第十一章。
======================================
[問題]我有一個 GridView,裡面的樣版(Template) 有著其他「子控制項」
這個子控制項要搭配其他資料表。
======================================
我做的是一個類似大腸包小腸的留言版功能--
外圍的 (大)GridView1,連結主要的資料表1
內部的 (小)GridView2,連結主要的資料表2
1). 當我在 (大)GridView1點選某一篇文章的時候,
2). 裡面的 (小)GridView2就會出現這篇文章的相關留言。
................................................................................................................................................
HTML畫面設計:
首先,設計一個 外圍的 (大)GridView1,連結主要的資料表1
搭配 SqlDataSource1
並且產生「選取」按鈕,也就是一個 Button的 CommandName = "Select"
然後在 (大)GridView1的「樣版(Template)」
編輯樣版內,放置 (小)GridView2,連結主要的資料表2。用來呈現這篇文章的留言。
兩個資料表,互有關連,透過 資料表1的「主索引鍵(PK。Primary Key)」串連在一起。
(小)GridView2 重要的設定畫面如下:
02 <div>
03
04 <br />
05 選取某一列紀錄之後,進入編輯模式。<br />
06 而且帶出這筆紀錄相關的「讀者留言」。<br />
07 <br />
08 <br />
09 <asp:GridView ID="GridView1" runat="server" AllowPaging="True"
10 AllowSorting="True" AutoGenerateColumns="False" BackColor="White"
11 BorderColor="#E7E7FF" BorderStyle="None" BorderWidth="1px" CellPadding="3"
12 DataKeyNames="id" DataSourceID="SqlDataSource1" GridLines="Horizontal">
13 <AlternatingRowStyle BackColor="#F7F7F7" />
14 <Columns>
15 <asp:CommandField ShowSelectButton="True" />
16 <asp:BoundField DataField="id" HeaderText="id" InsertVisible="False"
17 ReadOnly="True" SortExpression="id" />
18 <asp:BoundField DataField="test_time" HeaderText="test_time"
19 SortExpression="test_time" />
20 <asp:BoundField DataField="title" HeaderText="title" SortExpression="title" />
21 <asp:TemplateField>
22
23 <EditItemTemplate>
24
25
26 <asp:GridView ID="GridView2" runat="server" AutoGenerateColumns="False"
27 BackColor="White" BorderColor="#336666" BorderStyle="Double" BorderWidth="3px"
28 CellPadding="4" DataSourceID="SqlDataSource2" GridLines="Horizontal">
29 <Columns>
30 <asp:BoundField DataField="test_id" HeaderText="test_id"
31 SortExpression="test_id" />
32 <asp:BoundField DataField="test_time" HeaderText="test_time"
33 SortExpression="test_time" />
34 <asp:BoundField DataField="article" HeaderText="article"
35 SortExpression="article" />
36 <asp:BoundField DataField="author" HeaderText="author"
37 SortExpression="author" />
38 </Columns>
39 <FooterStyle BackColor="White" ForeColor="#333333" />
40 <HeaderStyle BackColor="#336666" Font-Bold="True" ForeColor="White" />
41 <PagerStyle BackColor="#336666" ForeColor="White" HorizontalAlign="Center" />
42 <RowStyle BackColor="White" ForeColor="#333333" />
43 <SelectedRowStyle BackColor="#339966" Font-Bold="True" ForeColor="White" />
44 <SortedAscendingCellStyle BackColor="#F7F7F7" />
45 <SortedAscendingHeaderStyle BackColor="#487575" />
46 <SortedDescendingCellStyle BackColor="#E5E5E5" />
47 <SortedDescendingHeaderStyle BackColor="#275353" />
48 </asp:GridView>
49
50 <asp:SqlDataSource ID="SqlDataSource2" runat="server"
51 ConnectionString="<%$ ConnectionStrings:testConnectionString1 %>"
52 SelectCommand="SELECT [test_id], [test_time], [article], [author] FROM [test_talk] WHERE ([test_id] = @test_id)">
53 <SelectParameters>
54 <asp:ControlParameter ControlID="GridView1" Name="test_id"
55 PropertyName="SelectedValue" Type="Int32" />
56 </SelectParameters>
57 </asp:SqlDataSource>
58
59
60 </EditItemTemplate>
61
62 </asp:TemplateField>
63 </Columns>
64 <FooterStyle BackColor="#B5C7DE" ForeColor="#4A3C8C" />
65 <HeaderStyle BackColor="#4A3C8C" Font-Bold="True" ForeColor="#F7F7F7" />
66 <PagerStyle BackColor="#E7E7FF" ForeColor="#4A3C8C" HorizontalAlign="Right" />
67 <RowStyle BackColor="#E7E7FF" ForeColor="#4A3C8C" />
68 <SelectedRowStyle BackColor="#738A9C" Font-Bold="True" ForeColor="#F7F7F7" />
69 <SortedAscendingCellStyle BackColor="#F4F4FD" />
70 <SortedAscendingHeaderStyle BackColor="#5A4C9D" />
71 <SortedDescendingCellStyle BackColor="#D8D8F0" />
72 <SortedDescendingHeaderStyle BackColor="#3E3277" />
73 </asp:GridView>
74
75 <asp:SqlDataSource ID="SqlDataSource1" runat="server"
76 ConnectionString="<%$ ConnectionStrings:testConnectionString1 %>"
77 SelectCommand="SELECT [id], [test_time], [class], [title], [summary], [article], [author] FROM [test]">
78 </asp:SqlDataSource>
79 <br />
80
81 </div>
82 </form>
................................................................................................................................................
最後,寫後置程式碼:
C#的寫法,請在最後加上「;」符號即可。
這東西一點都不難,書本的第七~第十章,好好練習幾次,就能有很多變化囉。
另外一個類似的範例,請參考:
[習 題]GridView樣版內部,改用CheckBox/Radio/DropDownList(單/複選 ...
新出版的「ASP.NET 4.0專題實務 I -- 入門實戰篇 / 松崗出版」,把這些相關範例歸納在第十一 章。
我將思想傳授他人, 他人之所得,亦無損於我之所有;
猶如一人以我的燭火點燭,光亮與他同在,我卻不因此身處黑暗。----Thomas Jefferson
線上課程教學,遠距教學 (Web Form 約 51hr) https://dotblogs.com.tw/mis2000lab/2016/02/01/aspnet_online_learning_distance_education_VS2015
線上課程教學,遠距教學 (ASP.NET MVC 約 140hr) https://dotblogs.com.tw/mis2000lab/2018/08/14/ASPnet_MVC_Online_Learning_MIS2000Lab
寫信給我,不要私訊 -- mis2000lab (at) yahoo.com.tw 或 school (at) mis2000lab.net
(1) 第一天 ASP.NET MVC5 完整影片(5.5小時 / .NET 4.x版)免費試聽。影片 https://youtu.be/9spaHik87-A
(2) 第一天 ASP.NET Core MVC 完整影片(3小時 / .NET Core 6.0~8.0)免費試聽。影片 https://youtu.be/TSmwpT-Bx4I
[學員感言] mis2000lab課程評價 - ASP.NET MVC , WebForm 。 https://mis2000lab.medium.com/%E5%AD%B8%E5%93%A1%E6%84%9F%E8%A8%80-mis2000lab%E8%AA%B2%E7%A8%8B%E8%A9%95%E5%83%B9-asp-net-mvc-webform-77903ce9680b
ASP.NET遠距教學、線上課程(Web Form + MVC)。 第一天課程, "完整" 試聽。
......... facebook社團 https://www.facebook.com/mis2000lab ......................
......... YouTube (ASP.NET) 線上教學影片 https://www.youtube.com/channel/UC6IPPf6tvsNG8zX3u1LddvA/
Blog文章 "附的範例" 無法下載,請看 https://dotblogs.com.tw/mis2000lab/2016/03/14/2008_2015_mis2000lab_sample_download
請看我們的「售後服務」範圍(嚴格認定)。
......................................................................................................................................................
ASP.NET MVC => .NET Core MVC 線上教學 ...... 第一天課程 完整內容 "免費"讓您評估 / 試聽
[遠距教學、教學影片] ASP.NET (Web Form) 課程 上線了!MIS2000Lab.主講 事先錄好的影片,並非上課側錄! 觀看時,有如「一對一」面對面講課。