This is a migrated thread and some comments may be shown as answers.

Unable to show/hide Columns of RadGridView on dropdown selection

1 Answer 169 Views

Grid

This is a migrated thread and some comments may be shown as answers.

Kaushik asked on 12 Jun 2013, 11:30 AM

Hi,

I had two user-controls on asp.net webpage. One had a dropdown selection listbox to select a value and other had a RadGridView to display the columns, I want to show / hide columns of RadGridView on drop-down selection. But I am unable to do not. Kindly help me on it. Below i am adding the code-snippet.

Default.aspx
------------------
<%@ Page Title="Home Page" Language="C#" MasterPageFile="" AutoEventWireup="true"
    CodeBehind="Default.aspx.cs" Inherits="WebApplication1._Default" %>
<%--<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>--%>
<%@ Register Src="~/Selection.ascx" TagName="Selection" TagPrefix="uc2" %>
<%@ Register Src="~/Display.ascx" TagName="Display" TagPrefix="uc1" %>

<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <uc2:Selection ID="ucSelection" runat="server" />
    </div>
    <div>
        <uc1:Display ID="ucDisplay" runat="Server" />
    </div>
    </form>
</body>
</html>

Default.aspc.cs
--------------------
<%@ Page Title="Home Page" Language="C#" MasterPageFile="" AutoEventWireup="true"
    CodeBehind="Default.aspx.cs" Inherits="WebApplication1._Default" %>
<%--<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>--%>
<%@ Register Src="~/Selection.ascx" TagName="Selection" TagPrefix="uc2" %>
<%@ Register Src="~/Display.ascx" TagName="Display" TagPrefix="uc1" %>

<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <uc2:Selection ID="ucSelection" runat="server" />
    </div>
    <div>
        <uc1:Display ID="ucDisplay" runat="Server" />
    </div>
    </form>
</body>
</html>

Selection.ascx
----------------------
<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="Selection.ascx.cs" Inherits="WebApplication1.Selection" %>
<asp:ScriptManager ID="ScriptManager1" runat="server">
        </asp:ScriptManager>
<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Always" RenderMode="Inline">
    <ContentTemplate>
            <table border="0" cellpadding="5" cellspacing="0">
                <tr class="valigntop">
                <td>
                        Payment Type :

                    </td>
                    <td>
                        <asp:DropDownList ID="cmbPaymentType" runat="server" OnSelectedIndexChanged="cmbPaymentType_SelectedIndexChanged"
                            AutoPostBack="true">
                            <asp:ListItem Text="11"></asp:ListItem>
                            <asp:ListItem Text="AA"></asp:ListItem>
                            <asp:ListItem Text="BB"></asp:ListItem>
                        </asp:DropDownList>
                    </td>
                </tr>
            </table>
    </ContentTemplate>
</asp:UpdatePanel>

Selection.ascx.cs
---------------------
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

namespace WebApplication1
{
    public partial class Selection : System.Web.UI.UserControl
    {
        int i = 0;
        public event EventHandler PaymentTypeChange;

        public string PaymentType
        {
            get
            {
                return cmbPaymentType.SelectedItem.Text;
            }
        }

        protected void Page_Load(object sender, EventArgs e)
        {

        }



        protected void cmbPaymentType_SelectedIndexChanged(object sender, EventArgs e)
        {
                PaymentTypeChange(this, e);
        }
    }
}

Display.ascx
-------------------
<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="Display.ascx.cs" Inherits="WebApplication1.Display" %>
<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="always" RenderMode="Inline">
    <ContentTemplate>
    <asp:Label ID="lblTest1" Text="Test" runat="server" Visible="false"></asp:Label>
    <telerik:RadGrid ID="rgTest" runat="server" GridLines="None" AutoGenerateColumns="False"
           EnableEmbeddedSkins="false" >
        <MasterTableView CommandItemDisplay="Top" EditMode="InPlace" TableLayout="Fixed">
            <Columns>
               <telerik:GridTemplateColumn DataField="ID" UniqueName="TestID" Visible="False">
                   <ItemTemplate>
                        <asp:Label ID="DisplayId" runat="server" Text="Id"></asp:Label>
                   </ItemTemplate>
               </telerik:GridTemplateColumn>
                <telerik:GridTemplateColumn DataField="Name" UniqueName="TestName" Visible="False">
                   <ItemTemplate>
                        <asp:Label ID="DisplayName" runat="server" Text="Name"></asp:Label>
                   </ItemTemplate>
               </telerik:GridTemplateColumn>
            </Columns>
        </MasterTableView>
    </telerik:RadGrid>
    </ContentTemplate>
</asp:UpdatePan

Display.ascx.cs
--------------------
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using Telerik.Web.UI;
using System.Web.UI.WebControls;

namespace WebApplication1
{
    public partial class Display : System.Web.UI.UserControl
    {

        protected void Page_Load(object sender, EventArgs e)
        {

        }

        public void SetVisiblity(bool enableVisiblity)
        {
            if (enableVisiblity == true)
            {
                foreach(GridColumn gd in rgTest.Columns)
                {
                    gd.Visible = true;
                }
                lblTest1.Visible = true;
            }
            else
            {
                foreach (GridColumn gd in rgTest.Columns)
                {
                    gd.Visible = false;
                }
                lblTest1.Visible = false;
            }
        }
    }
}

1 Answer, 1 is accepted

answered on 17 Jun 2013, 08:56 AM

ColumnsHiding.zip

Hello Kaushik,

From the code provided I did not notice where is the SetVisiblity method called. Now when a postback is triggered from the combo you can hide/show column by subscribing to the Page Load event of the user control in which the grid is placed. This is also demonstrated in the sample project attached. In the example provided once an item from the drop down is selected a grid column is being hidden. Note that instead of directly hiding the column you can call the SetVisiblity method.

Regards,
Angel Petrov
Telerik

If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to the blog feed now.