Adding Custom Control to Cells?

[Andrew]

Is there a way to add a custom control, such as CombBox or Button, to an individual column or cell?

If so could someone show me how or point me to an example that explains how this is done?

[Yordanka]

Hi Andrew,

I think this demo will help you to achieve your goals!

Best wishes,
Yordanka
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.

[Andrew]

That's what I need, but is there an example of how to do the same in code when binding a grid with a DataTable?

[Vlad]

Hi,

No matter how the grid is bound the easiest way to do this programmatically will be to inherit from grid columns, override CreateCellElement and/or CreateCellEditElement and return desired control.

Regards,
Vlad
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.

[Andrew]

The way I am currently binding to the grid is via the DataTable control defined here: blogs.telerik.com/vladimirenchev/posts/09-04-23/lightweight_datatable_for_your_silverlight_applications.aspx .

I have to bind in that fashion because the number and names of the columns in my grid are variable depending on a given database configuration. For a given column of the grid I need to define a custom control type for the cells of that column, and obviously this cannot be done declaratively and must be done in the code-behind at runtime. But no matter how I add custom columns to the grid when I set the ItemSource of the grid to the DataTable I have created it displays in exactly the same fashion every time.

Do you have any working examples displaying exactly how this configuration is achieved?

Thanks.

[Vlad]

Hi,

Can you verify if you have set AutoGenerateColumns to false in your case?

Greetings,
Vlad
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.

[Andrew]

Yes, I have tried disabling AutoGenerateColumns in both the markup and the code behind.

Here is the markup for the grid:

<telerikGrid:RadGridView x:Name="searchGrid" CanUserSelect="False" CanUserInsertRows="false" RowEditEnded="searchGrid_RowEditEnded" AutoGenerateColumns="false">
</telerikGrid:RadGridView>

And here is the code that binds the grid:

private void BindSearchGrid(Layouts layouts)
{
            DataTable dt;
            DataRow dr;
            FieldCollection fields;
            Field field;

            dt = new DataTable();

            dt.Columns.Add(new DataColumn() { ColumnName = "Field", DataType = typeof(string) });
            dt.Columns.Add(new DataColumn() { ColumnName = "Value", DataType = typeof(string) });

            for (int i = 0; i < fields.Count; i++)
            {
                field = fields[i];

                dr = new DataRow();

                dr["Field"] = field.Description;
                dr["Value"] = field.Value;

                dt.Rows.Add(dr);
            }

            GridViewLookupColumn column = new GridViewLookupColumn();
            column.Header = "Field";
            column.UniqueName = "Field";
            this.searchGrid.Columns.Add(column);

            column = new GridViewLookupColumn();
            column.Header = "Value";
            column.UniqueName = "Value";
            this.searchGrid.Columns.Add(column);


            this.searchGrid.AutoGenerateColumns = false;
            this.searchGrid.ItemsSource = dt;
}

where GridViewLookupColumn is a custom class that extends GridViewDataColumn.

What am I doing wrong here?

[Vlad]

Hi Andrew,

Sorry I'm a bit confused! What is the problem: You have more columns than expected or you don't have any values in cells?

Greetings,
Vlad
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.

[Andrew]

The problem is that the custom column type in the code above is never applying and I just get a regular text edit control. My GridViewLookupColumn class looks like the following:

    public class GridViewLookupColumn: GridViewDataColumn
    {
        public override FrameworkElement CreateCellElement(Telerik.Windows.Controls.GridView.GridViewCell cell, object dataItem)
        {
            LookupControl lookup = new LookupControl();
            cell.Content = lookup;

            return base.CreateCellElement(cell, dataItem);
        }

        public override FrameworkElement CreateCellEditElement(Telerik.Windows.Controls.GridView.GridViewCell cell, object dataItem)
        {
            LookupControl lookup = new LookupControl();
            cell.Content = lookup;

            return base.CreateCellEditElement(cell, dataItem);
        }
    }

The LookupControl class:

    public class LookupControl : Control
    {
        public LookupControl()
        {
            this.DefaultStyleKey = typeof(LookupControl);
        }
    }

And the Generic.xaml Theme that defines it:

<ResourceDictionary
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="clr-namespace:CIS.IR.WebAccess.Dashboard">


    <Style TargetType="local:LookupControl">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="local:LookupControl">

                    <Grid>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition />
                            <ColumnDefinition />
                        </Grid.ColumnDefinitions>
                        <Border Background="{TemplateBinding Background}"
                            BorderBrush="{TemplateBinding BorderBrush}"
                            BorderThickness="{TemplateBinding BorderThickness}">
                        </Border>
                        <TextBox x:Name="textBox" Grid.Column="0" Text="Test"/>
                        <Button x:Name="lookupButton" Grid.Column="1" Content="..."/>
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
</ResourceDictionary>

All I get when I view or edit the customized column is a simple TextBlock. I never see my TextBox or my Button. Am I doing something wrong?

[Vlad]

Hello Andrew,

Please return the desired control in both methods:

public class GridViewLookupColumn: GridViewDataColumn
    {
        public override FrameworkElement CreateCellElement(Telerik.Windows.Controls.GridView.GridViewCell cell, object dataItem)
        {
           var lookup = cell.Content as LookupControl;
            if(lookup != null)
            {
                 lookup = new LookupControl();
                 cell.Content = lookup;
            }           
 
            return lookup;
        }
 
        public override FrameworkElement CreateCellEditElement(Telerik.Windows.Controls.GridView.GridViewCell cell, object dataItem)
        {
            LookupControl lookup = new LookupControl();
            return  lookup;
        }
    }

Greetings,
Vlad
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.

[Vlad]

Hi Andrew,

Just a quick follow up! The code in CreateCellElement should be:

if(lookup == null)
{
  ...
}

Kind regards,
Vlad
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.