Solved

I need help working with Radio Buttons in Gridview controls, in my ASP.Net app.

Posted on 2009-07-14
1
380 Views
Last Modified: 2012-05-07
Hi Experts,
I have an ASP.Net application where I use multiple GridView controls.  Each GridView control contains a column of Radio Buttons so that the users can select a row.  The issue I am having is that when a user clicks on a radiobutton in one of the gridviews it deselects the radiobuttons in the other gridview.  
What I want to happen is for a user to select a radio button in each gridview and have the radio button stay selected.  Then click the 'Add Cost' button and display a Total (i.e. sum) of the of the selected rows in the Total textbox.
Please help me accomplish this.  I have include my source code and codebehind with this post.  The javascript function 'manageGrouping' was provided by Expert 'ddayx10' in a previous post.  Just thought I should give him credit.

Thanks in advance,
mrotor
HTML Source Code:
______________________________________________________________________
 
 
<%@ Page Language="VB" AutoEventWireup="false" CodeFile="MultipleGridViews.aspx.vb" Inherits="MultipleGridViews" %>
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title>Untitled Page</title>
    <style>
    
    div.scrollTableContainer {
    height: 50px;
    overflow: auto;
    width: 820px;
    margin: 1px 0 0 0;
    position: relative;
    }
    
    th 
    {
        background-color: #006699; 
        color: white; 
        position: relative; 
        top: expression(this.scrollTop);
        z-index: 10; 
    }
    .tableContainer
    {
        overflow-y: scroll; 
        height: 150px;
    }
    </style> 
    
    <script type="text/javascript">
	    function manageGrouping(valueSelected)
	    {
		    var radios = document.getElementsByTagName('input');
			
		    for(i=0;i<radios.length;i++)
		    {
			    if(radios[i].type == 'radio')
			    {
				    if(radios[i].value == valueSelected)
				    { 
				        radios[i].checked = true;
				        document.getElementById('<%=txtIn.ClientID%>').innerText = valueSelected; 
				    }
				    else
				    { 
				        radios[i].checked = false; 
				    }
			    }
		    }
	    }        
    </script>   
	    
	   <script type="text/javascript">
		    function manageGroupingOut(valueSelected)
	    {
		    var radios = document.getElementsByTagName('input');
			
		    for(i=0;i<radios.length;i++)
		    {
			    if(radios[i].type == 'radio')
			    {
				    if(radios[i].value == valueSelected)
				    { 
				        radios[i].checked = true;
				        document.getElementById('<%=txtOut.ClientID%>').innerText = valueSelected; 
				    }
				    else
				    { 
				        radios[i].checked = false; 
				    }
			    }
		    }
	    }        
	    </script>  
</head>
<body>
    <form id="form1" runat="server">
    <div>
        &nbsp;<strong> SELECTED ITEMS<br />
        </strong>
        <asp:Label ID="Label2" runat="server" Text="Pick Up Selected:"></asp:Label>&nbsp;
        <asp:TextBox ID="txtIn" runat="server" Width="293px"></asp:TextBox><br />
        <asp:Label ID="Label3" runat="server" Text="Drop Off Selected:"></asp:Label>
        <asp:TextBox ID="txtOut" runat="server" Width="290px"></asp:TextBox><br />
        <br />   
    
        <table ID="TabGrid" runat=server  style="width: 1000px" >
         <tr>
            <td width = 50%>
                <asp:Label ID="lblPickUp" runat="server" Text="Pick Up" Font-Bold="True" Font-Names="Arial" Font-Size="Medium"></asp:Label>
            </td>
            <td width = 50%>
                <asp:Label ID="lblDelivery" runat="server" Text="Drop Off" Font-Bold="True" Font-Names="Arial" Font-Size="Medium"></asp:Label>
            </td>
         </tr>
         <tr>
             <td valign="top" width = 50%>
                 <asp:GridView ID="gvPickUp" runat="server" 
                 Font-Names="Arial" Font-Size="Small" 
                 HeaderStyle-BackColor="Blue" AlternatingRowStyle-BackColor="Azure"
                 EditRowStyle-CssClass="rowClass" 
		        RowStyle-CssClass="rowClass" 
		        AlternatingRowStyle-CssClass="rowClass" 
		        SelectedRowStyle-CssClass="rowClass">
                    <Columns>
                        <asp:TemplateField>
                            <ItemTemplate>
                                <input id="Radio1" type="radio" name="PickUpX" value=<%# Eval("IDIN") %>  runat="server" enableviewstate ="true" onclick="manageGrouping(this.value);" />                                    
                            </ItemTemplate>
                        </asp:TemplateField>
                    </Columns>
                    <HeaderStyle BackColor="Blue" ForeColor="White" />
                    <AlternatingRowStyle BackColor="Azure" />
                </asp:GridView>
             </td>
             <td valign=top width = 50%>
                <asp:GridView ID="gvDropOff" runat="server" 
                Font-Names="Arial" Font-Size="Small" 
                HeaderStyle-BackColor="Blue" AlternatingRowStyle-BackColor="Azure"
                EditRowStyle-CssClass="rowClass" 
		        RowStyle-CssClass="rowClass" 
		        AlternatingRowStyle-CssClass="rowClass" 
		        SelectedRowStyle-CssClass="rowClass">
                    <Columns>
                        <asp:TemplateField>
                            <ItemTemplate>
                            <input id="Radio3" type="radio" name="DeliveryX" value=<%# Eval("IDOUT") %>  runat="server" enableviewstate ="true" onclick="manageGroupingOut(this.value);" />  
                            </ItemTemplate>
                        </asp:TemplateField>
                    </Columns>
                </asp:GridView>
             </td>
         </tr>
     </table>    
        <asp:Button ID="btnAdd" runat="server" Text="Add Cost" /><br />
        <asp:Label ID="Label1" runat="server" Font-Bold="True" Font-Size="Large" Text="Total:"></asp:Label>
        &nbsp;
        <asp:TextBox ID="txtTotal" runat="server"></asp:TextBox><br />
        &nbsp;&nbsp;
    </div>
    </form>
</body>
</html>
 
VB.Net CodeBehind:
______________________
 
Imports System.Data.SqlClient
Imports System.Data
 
Partial Class MultipleGridViews
    Inherits System.Web.UI.Page
    Dim MyConnection As New SqlConnection()
    Dim conn As New SqlConnection("Data Source=MyDB;Initial Catalog=Movies;Integrated Security =True")
 
    Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
        If Not IsPostBack Then
            Call GetStatusIn()
            Call GetStatusOut()
        End If
    End Sub
 
    Private Sub GetStatusIn()
        Dim sqlIN As String = "SELECT Amount + '-' + Title AS IDIN, Title, Amount FROM MOVIES WHERE Status = 'In'"
        Dim cmd As New SqlCommand(sqlIN, conn)
        conn.Open()
        Dim dr As SqlDataReader = cmd.ExecuteReader
        gvPickUp.DataSource = dr
        gvPickUp.DataBind()
        dr.Close()
        conn.Close()
    End Sub
 
    Private Sub GetStatusOut()
        Dim sqlOut As String = "SELECT Amount + '-' + Title AS IDOUT, Title, Amount FROM MOVIES WHERE Status = 'Out'"
 
        Dim cmd As New SqlCommand(sqlOut, conn)
        conn.Open()
        Dim dr As SqlDataReader = cmd.ExecuteReader
        gvDropOff.DataSource = dr
        gvDropOff.DataBind()
        dr.Close()
        conn.Close()
    End Sub
 
    Protected Sub gvPickUp_RowCreated(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.GridViewRowEventArgs) Handles gvPickUp.RowCreated
        If e.Row.RowType = DataControlRowType.Header Then
            e.Row.Cells(1).Visible = False
        End If
        If e.Row.RowType = DataControlRowType.DataRow Then
            e.Row.Cells(1).Visible = False
        End If
    End Sub
 
    Protected Sub gvDropOff_RowCreated(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.GridViewRowEventArgs) Handles gvDropOff.RowCreated
        If e.Row.RowType = DataControlRowType.Header Then
            e.Row.Cells(1).Visible = False
        End If
 
        If e.Row.RowType = DataControlRowType.DataRow Then
            e.Row.Cells(1).Visible = False
        End If
    End Sub
 
    Protected Sub btnAdd_Click(ByVal sender As Object, ByVal e As System.EventArgs) Handles btnAdd.Click
        Dim dblIn As Double = 0
        Dim dblOut As Double = 0
        Dim dblTotal As Double = 0
 
        If gvPickUp.Rows.Count > 0 Then
            If txtIn.Text <> "" Then
                '    dblIN = 0
                'Else
                Dim strIN As String = txtIn.Text
                Dim strInArray() As String = strIN.Split("-")
                dblIn = CDbl(strInArray(0))
            End If
        End If
 
        If gvDropOff.Rows.Count > 0 Then
            If txtOut.Text <> "" Then
                Dim strOUT As String = txtOut.Text
                Dim strOutArray() As String = strOUT.Split("-")
                dblOut = CDbl(strOutArray(0))
            End If
        End If
 
        dblTotal = dblIn + dblOut
        txtTotal.Text = dblTotal.ToString
    End Sub
End Class

Open in new window

0
Comment
Question by:mainrotor
1 Comment
 
LVL 13

Accepted Solution

by:
drypz earned 500 total points
ID: 24856546
Hi! Why don't you just use asp:RadioButton control then add a Validation group for each radiobutton in gridview. Something like

in gridview #1

                    <ItemTemplate>
                        <asp:RadioButton ID="RadioButton1" runat="server" ValidationGroup="Group1" />
                    </ItemTemplate>

in gridview #2

                    <ItemTemplate>
                        <asp:RadioButton ID="RadioButton1" runat="server" ValidationGroup="Group2" />
                    </ItemTemplate>
0

Featured Post

DevOps Toolchain Recommendations

Read this Gartner Research Note and discover how your IT organization can automate and optimize DevOps processes using a toolchain architecture.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

This article discusses how to create an extensible mechanism for linked drop downs.
FAQ pages provide a simple way for you to supply and for customers to find answers to the most common questions about your company. Here are six reasons why your company website should have a FAQ page
Explain concepts important to validation of email addresses with regular expressions. Applies to most languages/tools that uses regular expressions. Consider email address RFCs: Look at HTML5 form input element (with type=email) regex pattern: T…
Video by: Mark
This lesson goes over how to construct ordered and unordered lists and how to create hyperlinks.

809 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question