Custom Cell Editor nested controls events

[Alessio Bulleri]

I'm writing a custom editor which have to contains 2 drowdown controls: the second dropdown must be filled on values loaded from DB based on value selected in first dropdown. I need to let user add new values for both dropdowns.

I tried two ways but with no success.

First way: I created a custom editor containing 2 DrowDownListEditorElements and I tried to override EndEdit() method of each object to create new items if needed, but it seems that each EndEdit was never invoked and I cannot intercept  when user pass from one dropdown to other, or when exit from the editor.

 

Second way: I created a custom editor containing a user control containing two RadDropDownList controls and I used the Leave event of each dropDown to obtain excepted behaviour, but all I obtained is that EndEdit() of editor was first called before other event of child/nested controls.(for example if user press TAB when focused on second dropdown, editor EndEdit is fired before the drowdown Leave event handler, so new values aren't created yet and Editor value has not been set.

What's the correct way to manage events in complex grid cell custom editors?

Thnaks.

 

 

[Dimitar]

Hi Alessio,

In this case, you need to use the PropertyCahnged event of the drop down lists and add a new item when the ContainsFocus property is changed. I have attached a small sample that shows how you can create the desired editor.

I hope this will be useful. Let me know if you have additional questions.

Regards,
Dimitar
Telerik by Progress

[Alessio Bulleri]

Hi Dimitar.

Thanks for your precious answer and example. It seems to works fine, but I've a further question.

I'd like this behaviour:

- when the CellEditor enters in EditMode, the first DropDown should be focused, then when the user press TAB key, the second DropDown get focused, and then after a further TAB key press, the Cell exit from EditMode.

 

Thanks again,

 

Alessio Bulleri

 

 

 

[Dimitar]

Hello Alessio,

In order to process the Tab key, you need to create a custom row behavior. In this case, you can just focus the second drop down list:

public class CustomGridDataRowBehavior : GridDataRowBehavior
{
    protected override bool ProcessTabKey(KeyEventArgs keys)
    {
        if (this.GridControl.IsInEditMode)
        {
            var editor = this.GridControl.ActiveEditor as CustomDDLEditor;
            if (editor != null)
            {
                var element = editor.EditorElement as DoubleEditor;
                if (element.Ddl1.ContainsFocus)
                {
                    element.Ddl2.Focus();
                    return true;
                }
            }

        }
        return base.ProcessTabKey(keys);
    }
}

Here is how you can replace the default behavior:

BaseGridBehavior gridBehavior = radGridView1.GridBehavior as BaseGridBehavior;
gridBehavior.UnregisterBehavior(typeof(GridViewDataRowInfo));
gridBehavior.RegisterBehavior(typeof(GridViewDataRowInfo), new CustomGridDataRowBehavior());

Please let me know if there is something else I can help you with. 

Regards,
Dimitar
Telerik by Progress

[Alessio Bulleri]

Hi Dimitar,

Thanks a lot, it works like a charm !

I just have another small question, is it possible to put the two drop down in a split container so the use can resize them as needed ?

I've tried to look at SplitContainer/SplitPanel elements but I've not been able to figure out how to use them. Can you please point me in the right direction ?

Thanks a lot.

 

 

[Dimitar]

Hi  Alessio,

For this, you will need to create a custom control then you can add it to the element using RadHostItem. I have updated the project so it now shows this.

I hope this will be useful.

Regards,
Dimitar
Telerik by Progress

[Alessio Bulleri]

Hi Dimitar,

thanks a lot for your answer and for the example code, unfortunately it's too late for me to change approach (my delivery date is getting near) and if I can't add a split container from within my CreateChildElement method I prefere to drop this feature.

Regards

Alessio

[Dimitar]

Hello Alessio,

You can create the split container in code as well:

RadDropDownList radDropDownList1;
RadDropDownList radDropDownList2;

protected override void CreateChildElements()
{
    base.CreateChildElements();
    var radSplitContainer1 = new Telerik.WinControls.UI.RadSplitContainer();
    var splitPanel1 = new Telerik.WinControls.UI.SplitPanel();
    var splitPanel2 = new Telerik.WinControls.UI.SplitPanel();
     radDropDownList1 = new Telerik.WinControls.UI.RadDropDownList();
     radDropDownList2 = new Telerik.WinControls.UI.RadDropDownList();

    radSplitContainer1.Controls.Add(splitPanel1);
    radSplitContainer1.Controls.Add(splitPanel2);
    radSplitContainer1.Dock = System.Windows.Forms.DockStyle.Fill;
    radSplitContainer1.Location = new System.Drawing.Point(0, 0);

    radDropDownList1.Dock = DockStyle.Fill;
    radDropDownList2.Dock = DockStyle.Fill;

    splitPanel1.Controls.Add(radDropDownList1);
    splitPanel2.Controls.Add(radDropDownList2);


    var host = new RadHostItem(radSplitContainer1);
    host.MinSize = new Size(100, 20);

    radDropDownList1.PropertyChanged += Ddl1_PropertyChanged;
    radDropDownList1.DataSource = GetData();
    radDropDownList1.DisplayMember = "Text";
    radDropDownList1.ValueMember = "Text";


    radDropDownList2.PropertyChanged += Ddl1_PropertyChanged;
    radDropDownList2.DataSource = GetData();
    radDropDownList2.DisplayMember = "Text";
    radDropDownList2.ValueMember = "Text";

    this.Children.Add(host);


    this.Orientation = Orientation.Horizontal;
    this.StretchHorizontally = true;
    this.Value = new string[2];
}

Please let me know if there is something else I can help you with. 

Regards,
Dimitar
Telerik by Progress

[Alessio Bulleri]

Thank you !