How do I unselect and select a radio button on different rows of a GridView?

I have two gridviews on a page.  Each grid has a list of things that are potential matches.  The users has to pick one item from each grid and then click a "Reconcile" button.

How can I, through JQuery, make sure that only one row in each grid is selected?  Specifically I need code to execute on the onclick of a radiobutton (not in a radiobuttonlist because the buttons are spread across rows of the gridview) to unselect all the radio buttons in that grid and then select just the button from which the onclick fired.

Thanks!
This is how the gridview columns are setup:

  <Columns>                        
                        <asp:HyperLinkField DataTextField="ExtractID" 
                            DataNavigateUrlFormatString="~/WebForms/Extract/ExtractList.aspx?extractID={0}"
                            DataNavigateUrlFields="ExtractID" HeaderText="ID" SortExpression="ExtractID" 
                           ItemStyle-BorderColor="#CCCCCC"  />
                        <asp:BoundField DataField="JobName" HeaderText="Job Name"  /> 
                       <asp:BoundField DataField="FileName" HeaderText="File Name" />
                       <asp:BoundField DataField="DeliveryProtocolName" HeaderText = "Delivery Protocol" />
                       <asp:BoundField  DataField="FrequencyName" HeaderText="Frequency" />           
                       <asp:TemplateField HeaderText="Description" >
                        <ItemStyle HorizontalAlign="Left" Width="150" Font-Size="X-Small" />
                            <ItemTemplate>                    
                                    <asp:Label ID="lblDesc"  style=" "  Text='' runat="server"/>                    
                            </ItemTemplate>                                
                       </asp:TemplateField>
                        <asp:TemplateField>
                            <ItemTemplate>
                                <asp:RadioButton ID="rbUserExtractToReconcile" runat="server" />
                            </ItemTemplate>
                        </asp:TemplateField> 
                    </Columns>

Open in new window

Extract-Reconciliation-no-menu.png
LVL 1
BruceAsked:
Who is Participating?
 
leakim971Connect With a Mentor PluritechnicianCommented:
0
 
leakim971PluritechnicianCommented:
Hello cylikon,

You need to group radio button by give them the same groupname attribute : http://msdn.microsoft.com/en-us/library/system.web.ui.webcontrols.radiobutton.groupname(VS.100).aspx

Other link : http://msdn.microsoft.com/en-us/library/z26z1156(VS.100).aspx
(section To group individual RadioButton Web server controls)


<asp:RadioButton ID="rbUserExtractToReconcile" GroupName="gnUserExtractToReconcile" runat="server" />

Open in new window

0
 
BruceAuthor Commented:
leakim971:  Thanks for the response.  

I tried you suggestion but it doesn't seem to work.  I think its because the name is mangled by the ASP.NET engine.  When I look at the source of the HTML page all the "name"'s of the radio buttons are different.

name="ctl00$ContentPlaceHolder1$gvUserEnteredExtracts$ctl02$gnUserEnteredExtracts"
name="ctl00$ContentPlaceHolder1$gvUserEnteredExtracts$ctl03$gnUserEnteredExtracts"

On that, I did try to add the names manually in the RowDataBound Event but they still got mangled.  See my code below.

Any other ideas?  Thoughts?

protected void gvUserEnteredExtracts_RowDataBound(object sender, GridViewRowEventArgs e )
    {
        GridViewRow row = e.Row;
        if (row.RowType == DataControlRowType.DataRow)
        {
            RadioButton rb = (RadioButton) row.FindControl("rbUserExtractToReconcile");
            rb.Attributes.Add("name", "gnUserExtractToReconcile");
        }
    }

Open in new window

0
 
leakim971PluritechnicianCommented:
Thanks for the points!
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.