Gridview column header with Custom dropdownlist

[Achyut Dutt]

Hi !
I have used a dropdownlist in the Gridview column's header for selecting column name. I have created a custom dropdownlist in creating a header cell class which I am using at GridView Column's Header. I am getting problem when I am selecting any value in dropdownlist and when I am moving scroll bar of gridview then its value getting reset automatically. I want to select column name from dropdownlist in header cell. Kindly, find the code I am using and Images related to problem.

public class MyHeaderCellElement : GridHeaderCellElement
   {
       GridViewColumn _col;
     public MyHeaderCellElement(GridViewColumn col, GridRowElement row)
           : base(col, row)
       {
           _col = col;
          this.TextAlignment = ContentAlignment.TopCenter;
       }
       RadDropDownListElement dropDownListElement1;
       RadCheckBoxElement checkBox1 = new RadCheckBoxElement();

       protected override void CreateChildElements()
       {
           base.CreateChildElements();
           if (dropDownListElement1 == null || dropDownListElement1.DataSource == null)
           {
               dropDownListElement1 = new RadDropDownListElement();
              checkBox1.StretchHorizontally = true;
               checkBox1.ToggleStateChanged += new StateChangedEventHandler(checkBox1_ToggleStateChanged);
               this.Children.Add(checkBox1);
               dropDownListElement1.DropDownStyle = Telerik.WinControls.RadDropDownStyle.DropDownList;
              List<string> lst = solusDataAccess.GetMasterFields(solusGeneric.strConnectionString).AsEnumerable().Select(x => x[0].ToString()).ToList();
               dropDownListElement1.DataSource = lst;
               dropDownListElement1.Margin = new Padding(15, 0, 0, 0);
               dropDownListElement1.StretchHorizontally = true;
               dropDownListElement1.SelectedIndexChanged += new Telerik.WinControls.UI.Data.PositionChangedEventHandler(dropDownListElement1_SelectedIndexChanged);
               this.Children.Add(dropDownListElement1);
           }
       }

       void checkBox1_ToggleStateChanged(object sender, StateChangedEventArgs args)
       {
           if (solusGeneric.dicStrColumnFlag.ContainsKey(_col.Name))
               solusGeneric.dicStrColumnFlag.Remove(_col.Name);
           solusGeneric.dicStrColumnFlag.Add(_col.Name, checkBox1.Checked);
       }

            public override bool IsCompatible(GridViewColumn data, object context)
       {
           return data is GridViewTextBoxColumn && context is GridHeaderCellElement; ;
       }

       protected override Type ThemeEffectiveType
       {
           get
           {
               return typeof(GridHeaderCellElement);
           }
       }
   }

Thanks and Regards
Achyut 

[Ivan Petrov]

Hello Achyut,

Thank you for writing.

Because of the UI virtualization of RadGridView cells are reused and scrolling changes only the data displayed by the cells. That said you need to tell your cell elements that the data they are displaying has changed. You can do this through the SetContentCore method. Here is how to do this. In your cell element class override the method and set the value that is passed to the selected item property of the drop down inside the cell element:

protected override void SetContentCore(object value)
{
    this.dropDownListElement1.SelectedValue = value;
}

I hope this will be useful. Should you have further questions, I would be glad to help.

Regards,
Ivan Petrov
the Telerik team

[Achyut Dutt]

Hello Ivan,

I didn't understand your solution properly. Can you explain is bit further ? I would like to get your example in my code and a bit of explanation.  

Additional Information : I would like to tell you that I have a custom dropdownlist  created in different class as a header cell. I have attached that header cell in the Datagridview in form class. If you have any doubt than please , revert back.

I appreciate you reply. 

Thanks and Regards,
Achyut

[Ivan Petrov]

Hello Achyut,

Thank you for your reply.

RadGridView utilizes UI virtualization. The idea behind this concept is that no matter how many rows of data you have you can have only a fixed number of visible rows at a given time. This number is defined by the amount of space there is for the grid. When you scroll up/down or left/right the visual rows/columns are reused and only the data they display is changed. Having that in mind the SetContentCore method is called when you scroll and the data displayed in the column has to be changed. The value passed as an argument to the method in the case of header cells is the header text of the column.

I hope this clears things. Should you need other information, feel free to write back.

Regards,
Ivan Petrov
the Telerik team

[Achyut Dutt]

Hi Ivan !

You have clear my some doubts regarding RadGridView. Unfortunately, My problem still there. 

If you run the project, than you will see that dropdownlist is placed on radgridview header and from dropdownlist I select the columnname. So, when it is creating GridHeaderCellElement than I am creating dropdownlist element and populating it. According to you, when we uses scroll bar every time it creates new GridHeaderCellElement and hence, dropdownlist also get reset because it is populating again. So , can you suggest me that how can I stop reseting of dropdownlist and Populate once only when form is loading. 

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Drawing;
using System.Windows.Forms;
using Telerik.WinControls.UI;
using System.Data;
using System.Configuration;

namespace SampleProject
{
    public class MyHeaderCellElement : GridHeaderCellElement
    {
        GridViewColumn _col;
        public MyHeaderCellElement(GridViewColumn col, GridRowElement row)
            : base(col, row)
        {
            _col = col;
            this.TextAlignment = ContentAlignment.TopCenter;
        }
        RadDropDownListElement dropDownListElement1;

        protected override void CreateChildElements()
        {
            dropDownListElement1 = new RadDropDownListElement();
            base.CreateChildElements();

            dropDownListElement1.DropDownStyle = Telerik.WinControls.RadDropDownStyle.DropDownList;
            List<string> lst = new List<string>(ConfigurationManager.AppSettings["List"].Split(new char[] { ',' })); ;
            dropDownListElement1.DataSource = lst;
            dropDownListElement1.StretchHorizontally = true;
            dropDownListElement1.SelectedIndexChanged += new Telerik.WinControls.UI.Data.PositionChangedEventHandler(dropDownListElement1_SelectedIndexChanged);
            this.Children.Add(dropDownListElement1);
        }


        void dropDownListElement1_SelectedIndexChanged(object sender, Telerik.WinControls.UI.Data.PositionChangedEventArgs e)
        {
        }


        public override bool IsCompatible(GridViewColumn data, object context)
        {
            return data is GridViewTextBoxColumn && context is GridHeaderCellElement;
        }

        protected override Type ThemeEffectiveType
        {
            get
            {
                return typeof(GridHeaderCellElement);
            }
        }

        protected override void SetContentCore(object value)
        {
            //this.dropDownListElement1.SelectedValue = value;
        }
    }
}

Here, I am populating dropdownlist from app.config using List. I hope you understands my problem.

I appreciate your reply. If any other doubt, please write back.

Thanks and Regards
Achyut

[Ivan Petrov]

Hello Achyut,

Thank you for writing back.

The elements in RadGridView are created only when they cannot be reused. Here is another article which explains how the UI Virtualization works - Explained: RadGridView for WinForms virtualization. 

You can think of this mechanism as two layers on top of each other. The bottom one is the data layer and the top one is the UI layer. The data layer is a huge table with the number of columns and rows in your data source. The UI layer is a small window composed of elements that shows only a portion of the data layer and hides the rest. When you scroll, this window (the UI layer), actually stays stationary and instead the data layer behind it is moved in the opposite direction. You can see an image illustration of this in the article. When this move of the data layer happens the data each cell is displaying has to be changed. This is where the SetContentCore method is called.

I hope this is helpful. Do not hesitate to write back with any further questions.

All the best,
Ivan Petrov
the Telerik team

[Achyut Dutt]

Hi Ivan !

I tried with SetContentCore Method, firstly, it is not assigning value in the SelectedText of dropdownlistelement1. 

Secondly, its not effecting dropdownlist reseting. Its reseting again.

Can you show me some codes with Explanation? If possible, can you show sample project with dropdownlist on radgridview's header and solving my problem ? I tried to attach my sample project but it seems we can only attach Images. I appreciate your concern on this. I am looking forward for more help in this issue.

protected override void SetContentCore(object value)
{
    if (this.Value != null && this.Value != DBNull.Value)
    {
        dropDownListElement1.SelectedText = this.Value.ToString();

    }
}

Thanks and Regards
Achyut

[Ivan Petrov]

Hello Achyut,

Thank you for your reply.

I have attached an example project which demonstrates how you can achieve your scenario. What I have done is I copy-pasted your code in a form and removed some lines of code so only code related to the example remains. This will make it easier for you to get the idea of the code. 

I hope this will help. Feel free to write back with further questions.

All the best,
Ivan Petrov
the Telerik team

[Achyut Dutt]

Hello Ivan,

I have checked your example project. I observed that same error is occurring in your example. When I am moving scroll dropdownlist resetting to default value. My issue still there.

P.S. - I am using Visual Studio 2010 and FrameWork 4.0 with telerik winform Q3 2012.     

I appreciate your concern on this.

Thanks and Regards
Achyut

[Stefan]

Hello Achyut,

Thank you for writing back.

I was able to observe the experienced behavior. It is caused when you use the horizontal scroll bar of RadGridView. The reason for it is that the value of the cell is not persisted anywhere and it is reset when the element is invalidated. Please refer to the attached project, where I you can see how to persist the value correctly.

Let me know how this works for you,
 
Kind regards,
Stefan
the Telerik team

[Achyut Dutt]

Hi Stefan,

While running the project provided by you, I am getting error : 

'Telerik.WinControls.UI.GridViewColumn' does not contain a definition for 'Tag' and no extension method 'Tag' accepting a first argument of type 'Telerik.WinControls.UI.GridViewColumn' could be found (are you missing a using directive or an assembly reference?)

I am using Visual Studio 2010 with Framework 4.0.

Thanks and Regards
Achyut

[Stefan]

Hi Achyut,

The Tag property of the column is introduced in the Service Pack of Q3 2012. I would suggest to upgrade your project to the latest version (or at least the service pack), so you can take advantage of this functionality.
 
Kind regards,
Stefan
the Telerik team