ASP.NET 魔法學院

GridView 的每筆資料列若需要 RadioButton 做單選的功能，一般直覺只要建立一個 TemplateField 放置 RadioButton 控制項即可達成這樣的功能。

<asp:TemplateField HeaderText="選擇" InsertVisible="False"> <STRONG><FONT color=#ff0000> <ItemTemplate> <asp:RadioButton ID="RadioButton1" runat="server" /> </ItemTemplate></FONT></STRONG> </asp:TemplateField>

可是執行的結果會發現好像不是想像中的樣子，GridView 中的 RadioButton 無法做到資料列單選功能。

這樣為什麼呢？主要的原因是 GridView 中子控制項的命名規則，因為要識別每筆資料列的子控制項，所以 TemplateField 的 RadioButton 輸出的 HTML 碼的 name 都不一致，而 name 不一致無法視為同一群組，故無法做到單選的效果。

<input id="GridView1_ctl02_RadioButton1" type="radio" name="GridView1$ctl02$RadioButton1" value="RadioButton1" /> <input id="GridView1_ctl03_RadioButton1" type="radio" name="GridView1$ctl03$RadioButton1" value="RadioButton1" /> <input id="GridView1_ctl04_RadioButton1" type="radio" name="GridView1$ctl04$RadioButton1" value="RadioButton1" />

看了以上的結果，可以知道重點就是要想辨法讓 RadioButton 輸出的 name 相同就可以達成需求。所以我們將 RadioButton 控制項換成「HTML 頁籤」的 Input (Radio) HTML 控制項，將 name 屬性設為 RowSelected ， value 屬性繫結 ProductID 欄位 (識別欄位)。

<asp:TemplateField HeaderText="選擇" InsertVisible="False"> <ItemTemplate> <input id="Radio" type="radio" name="<STRONG><FONT color=#ff0000>RowSelected</FONT></STRONG>" value='<FONT color=#ff0000><STRONG><%# Eval("ProductID") %></STRONG></FONT>' /> </ItemTemplate> </asp:TemplateField>

執行結果查看 HTML 原始碼，可以輸出的 name 都相同，就可以達到單選的功能。

<input id="Radio" type="radio" name="RowSelected" value='1' /> <input id="Radio" type="radio" name="RowSelected" value='2' /> <input id="Radio" type="radio" name="RowSelected" value='3' />

接下來的問題就是 PostBack 後伺服端如何得知選了那筆資料，form 中的資料會透過 Request.Form 傳給伺服端。在頁面上放置一個按鈕撰寫取得使用者選取資料列的相關程式碼，其中 Request.Form("RowSelected") 的值即為選取資料列的識別值。

Protected Sub Button1_Click(ByVal sender As Object, ByVal e As System.EventArgs) Handles Button1.Click Dim sProductID As String sProductID = Me.Request.Form("RowSelected") Me.Response.Write("Select ProdustID: " & sProductID) End Sub

ASP.NET 魔法學院