Show Hide DataGrid rows based on RadioButtonList selection using jQuery in ASP.Net

Hi Amitabha,

Check this example. Now please take its reference and correct your code.

HTML

<div class="container">
    <label class="text-sm" for="rboInvMode">Invoice</label>
    <div class="form-group">
        <asp:RadioButtonList CssClass="form-control user text-center" RepeatColumns="4" RepeatLayout="Flow"
            RepeatDirection="Horizontal" ID="rboInvMode" runat="server">
            <asp:ListItem Value="S">Single</asp:ListItem>
            <asp:ListItem Selected="True" Value="M">Multiple</asp:ListItem>
        </asp:RadioButtonList>
    </div>
    <asp:DataGrid ID="gridPackage" runat="server" HeaderStyle-BackColor="#0099cc" HeaderStyle-ForeColor="White"
        ItemStyle-Font-Size="Small" FooterStyle-Font-Size="Small"
        AutoGenerateColumns="false" class="table table-striped table-bordered" Width="100%">
        <Columns>
            <asp:BoundColumn DataField="SrNo" HeaderText="Sr.No"></asp:BoundColumn>
            <asp:TemplateColumn HeaderText="Group Code">
                <ItemTemplate>
                    <asp:DropDownList ID="ddlGoodsGroupCode" runat="server" CssClass="form-control selectpicker">
                    </asp:DropDownList>
                    <input id="txtGoodsGroupCode" runat="server" type="hidden" value='<%# DataBinder.Eval(Container.DataItem,"GROUP_CODE")%>' />
                </ItemTemplate>
            </asp:TemplateColumn>
            <asp:TemplateColumn HeaderText="Goods Description">
                <ItemTemplate>
                    <asp:DropDownList ID="ddlGoodsSubCode" runat="server" CssClass="form-control selectpicker">
                    </asp:DropDownList>
                    <input id="txtGoodsSubCode" runat="server" type="hidden" value='<%# DataBinder.Eval(Container.DataItem,"GROUP_SUB_DESC")%>' />
                </ItemTemplate>
            </asp:TemplateColumn>
            <asp:TemplateColumn HeaderText="Packing Type">
                <ItemTemplate>
                    <asp:DropDownList ID="ddlPackType" runat="server" CssClass="form-control selectpicker">
                    </asp:DropDownList>
                    <input id="txtPackageType" runat="server"
                        type="hidden" value='<%# DataBinder.Eval(Container.DataItem,"PACKING_TYPE")%>' />
                </ItemTemplate>
            </asp:TemplateColumn>
            <asp:TemplateColumn HeaderText="Packages">
                <ItemTemplate>
                    <asp:TextBox ID="txtPackage" runat="server" CssClass="form-control  only-numeric" Text='<%#DataBinder.Eval(Container.DataItem,"PACKING_PKGS")%>'></asp:TextBox>
                </ItemTemplate>
            </asp:TemplateColumn>
            <asp:TemplateColumn HeaderText="Packing Description">
                <ItemTemplate>
                    <asp:TextBox ID="txtPackageDesc" runat="server" CssClass="form-control"
                        Text='<%#DataBinder.Eval(Container.DataItem,"PACKING_DESC")%>'></asp:TextBox>
                </ItemTemplate>
            </asp:TemplateColumn>
        </Columns>
    </asp:DataGrid>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css" />
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
    <script type="text/javascript" src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js"></script>
    <script type="text/javascript">
        $(function () {
            $('[id*=rboInvMode]').on('click', function () {
                var mode = $(this).val();
                if (mode == "S") {
                    $("[id*=gridPackage]").find("tr:not(:nth-child(1)):not(:nth-child(2))").hide();
                }

                if (mode == "M") {
                    $("[id*=gridPackage] tr").show();
                }
            });
        });
    </script>
</div>

Code

C#

protected void Page_Load(object sender, EventArgs e)
{
    if (!this.IsPostBack)
    {
        DataTable dt = new DataTable();
        dt.Columns.AddRange(new DataColumn[]
        {
            new DataColumn("SrNo"),
            new DataColumn("GROUP_CODE"),
            new DataColumn("GROUP_SUB_DESC"),
            new DataColumn("PACKING_TYPE"),
            new DataColumn("PACKING_PKGS"),
            new DataColumn("PACKING_DESC")
        });
        for (int i = 0; i < 5; i++)
        {
            DataRow dr = dt.NewRow();
            dr["SrNo"] = i + 1;
            dt.Rows.Add(dr);
        }
        gridPackage.DataSource = dt;
        gridPackage.DataBind();
    }
}

VB.Net

Protected Sub Page_Load(ByVal sender As Object, ByVal e As EventArgs) Handles Me.Load
    If Not Me.IsPostBack Then
        Dim dt As DataTable = New DataTable()
        dt.Columns.AddRange(New DataColumn() {
                            New DataColumn("SrNo"),
                            New DataColumn("GROUP_CODE"),
                            New DataColumn("GROUP_SUB_DESC"),
                            New DataColumn("PACKING_TYPE"),
                            New DataColumn("PACKING_PKGS"),
                            New DataColumn("PACKING_DESC")})
        For i As Integer = 0 To 5 - 1
            Dim dr As DataRow = dt.NewRow()
            dr("SrNo") = i + 1
            dt.Rows.Add(dr)
        Next

        gridPackage.DataSource = dt
        gridPackage.DataBind()
    End If
End Sub

Screenshot