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

Custom Editor

5 Answers 297 Views
GridView
This is a migrated thread and some comments may be shown as answers.
David
Top achievements
Rank 1
David asked on 19 Jun 2017, 12:03 PM

Hi,

I am evaluating your WinForms control suite to see if I could use it for a project I'm working on. I'm trying to create a custom editor in a GridView that would allow me to have a searchable ComboBox where the users can add/rename items right from the editor. First I tried to add an element while in edit mode based on an forum thread I saw (I added a TextBox in addition to the combobox) but I cannot get it to allow focus on the textbox in addition to the ComboBox. Is there a better way to achieve having a ComboBox AND TextBox together in the same editor? Or do you have a better idea of how I could achieve the user story of allowing the user to add/rename items from the ComboBox right from the grid without having another form? From what I'm seeing it looks like the GridBaseEditor just allows one EditorElement not two. Any help you could provide would be appreciated.

Thank you for your time.

5 Answers, 1 is accepted

Sort by
0
Dess | Tech Support Engineer, Principal
Telerik team
answered on 20 Jun 2017, 10:02 AM
Hello David, 

Thank you for writing.  

Following the provided information I have prepared a sample project for your reference which result is illustrated in the attached gif file. Note that this is just a sample approach and it may not cover all possible cases. Feel free to modify it in a way which suits your requirement best.

I hope this information helps. Should you have further questions I would be glad to help.

 Regards,
Dess
Progress Telerik
Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
0
Fabrizio
Top achievements
Rank 1
answered on 09 May 2019, 09:26 AM

Hi,

I am evaluating your WinForms control suite to see if I could use it for a project I'm working on. I'm trying to create a custom editor in a GridView.

One column of my GridView contains a currency formatted decimal (the price of the product). I would like that when I edit this data, a custom editor appears with a RadSpinEditor to allow me to enter a new value and severals RadLabel contains with informations (see attachment).

However, I don't understand how it works.

Can you help me ?

Is it posible to arrange controls in a custom editor with a layout control ?

Thank you for your time.

Fabrizio

0
Dess | Tech Support Engineer, Principal
Telerik team
answered on 09 May 2019, 12:06 PM
Hello, Fabrizio,     

I have prepared a sample code snippet demonstrating how to construct a custom currency editor that contains a spin editor and two text elements as it is illustrated below:



    public RadForm1()
    {
        InitializeComponent();
 
        BindingList<Item> items = new BindingList<Item>();
        for (int i = 1; i <= 3; i++)
        {
            items.Add(new Item(i, "Item" + i, 1.25m * i));
        }
        this.radGridView1.DataSource = items;
        this.radGridView1.AutoSizeColumnsMode = Telerik.WinControls.UI.GridViewAutoSizeColumnsMode.Fill;
 
        this.radGridView1.EditorRequired += radGridView1_EditorRequired;
    }
 
    private void radGridView1_EditorRequired(object sender, Telerik.WinControls.UI.EditorRequiredEventArgs e)
    {
        if (this.radGridView1.CurrentColumn.Name == "Price")
        {
            e.EditorType = typeof(MyCustomCurrencyEditor);
        }
    }
}
 
public class MyCustomCurrencyEditor : BaseGridEditor
{
    protected override Telerik.WinControls.RadElement CreateEditorElement()
    {
        return new CustomSpinEditorElement();
    }
 
    public override object Value
    {
        get
        {
            CustomSpinEditorElement element = this.EditorElement as CustomSpinEditorElement;
            return element.SpinEditorElement.Value;
        }
        set
        {
            CustomSpinEditorElement element = this.EditorElement as CustomSpinEditorElement;
            element.SpinEditorElement.Value = (decimal)value;
        }
    }
 
    public override void BeginEdit()
    {
        base.BeginEdit();
        CustomSpinEditorElement element = this.EditorElement as CustomSpinEditorElement;
        element.SpinEditorElement.DecimalPlaces = 2;
        element.SpinEditorElement.TextBoxControl.Focus();
    }
}
 
public class CustomSpinEditorElement : RadTextBoxEditorElement
{
    StackLayoutElement stack = new StackLayoutElement();
    RadSpinEditorElement spinEditorElement = new RadSpinEditorElement();
    LightVisualElement text1 = new LightVisualElement();
    LightVisualElement text2 = new LightVisualElement();
 
    public CustomSpinEditorElement()
    {
        this.TextBoxItem.Visibility = ElementVisibility.Collapsed;
        this.Padding = new Padding(0);
    }
 
    public RadSpinEditorElement SpinEditorElement
    {
        get
        {
            return this.spinEditorElement;
        }
    }
 
    protected override void CreateChildElements()
    {
        base.CreateChildElements();
        stack.Margin = new System.Windows.Forms.Padding(0);
        stack.StretchHorizontally = true;
        stack.StretchVertically = true;
        stack.Orientation = Orientation.Horizontal;
        stack.Children.Add(spinEditorElement);
        stack.Children.Add(text1);
        text1.Text = "Text1";
        text2.Text = "Text2";
        stack.Children.Add(text2);
 
        this.Children.Add(stack);
    }
}
 
public class Item
{
    public int Id { get; set; }
 
    public string Name { get; set; }
 
    public decimal Price { get; set; }
 
    public Item(int id, string name, decimal price)
    {
        this.Id = id;
        this.Name = name;
        this.Price = price;
    }
}

Note that this is just a sample approach and it may not cover all possible cases. Feel free to extend it in a way which suits your requirement best.

Off topic, I will recommend you to activate a 30-day free trial, giving you some time to explore the toolkit and consider using it for your current or upcoming WinForms development.

Regards,
Dess | Tech Support Engineer, Sr.
Progress Telerik
Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
0
Fabrizio
Top achievements
Rank 1
answered on 09 May 2019, 04:23 PM
Hi

Thank you.
If I replace in your code the two LightVisualElement control in the CustomSpinEditorElement class, by a RadDropdownButtonElement, the dropDownListElement and the spinEditorElement in the StackLayoutElement are the same width. Can you tell me if is it possible to set the size of the DropdownButtonElement and to dock it at right and the spinEditorElement dock fill ?

Thank you
0
Dess | Tech Support Engineer, Principal
Telerik team
answered on 10 May 2019, 01:55 PM
Hello, Fabrizio,     

You can disable the horizontal stretching of the RadDropDownButtonElement and specify its MinSize. Thus, the RadSpinEditorElement will stretch horizontally to fill the space:



public class CustomSpinEditorElement : RadTextBoxEditorElement
{
    StackLayoutElement stack = new StackLayoutElement();
    RadSpinEditorElement spinEditorElement = new RadSpinEditorElement();
    RadDropDownButtonElement text1 = new RadDropDownButtonElement();
 
    public CustomSpinEditorElement()
    {
        this.TextBoxItem.Visibility = ElementVisibility.Collapsed;
        this.Padding = new Padding(0);
    }
 
    public RadSpinEditorElement SpinEditorElement
    {
        get
        {
            return this.spinEditorElement;
        }
    }
 
    protected override void CreateChildElements()
    {
        base.CreateChildElements();
        stack.Margin = new System.Windows.Forms.Padding(0);
        stack.StretchHorizontally = true;
        stack.StretchVertically = true;
        stack.Orientation = Orientation.Horizontal;
        stack.Children.Add(spinEditorElement);
        stack.Children.Add(text1);
        text1.Text = "Text1";
        text1.StretchHorizontally = false;
        text1.MinSize = new System.Drawing.Size(60,18);
 
        this.Children.Add(stack);
    }
}

I hope this information helps. If you need any further assistance please don't hesitate to contact me. 
 
Regards,
Dess | Tech Support Engineer, Sr.
Progress Telerik
Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
Tags
GridView
Asked by
David
Top achievements
Rank 1
Answers by
Dess | Tech Support Engineer, Principal
Telerik team
Fabrizio
Top achievements
Rank 1
Share this question
or