How to define a dependency property on a custom column and use the row item as datacontext

6 posts, 0 answers
  1. Tobania
    Tobania avatar
    160 posts
    Member since:
    Apr 2010

    Posted 13 Dec 2013 Link to this post


    I have a grid bound to a collection of items.

    An item has several properties and one property is a combination of 4 properties (omitted INotifyPropertyChanged etc):
    public class MyItemViewModel
        public int Number { get; set; }
        public string NumberSeperator { get; set; }
        public int SubNumber { get; set; }
        public string SubSubNumber { get; set; }
        public string FullNumber {
                return string.Format("{0}{1}{2}{3}", Number, NumberSeperator, SubNumber, SubSubNumber);

    There are of course more properties available but the focus is on these properties mentioned.
    Now, I tried creating a custom column which will, in view mode, display the FullNumber property and in edit mode create 4 masked text boxes to edit those 4 properties seperatly (Number, NumberSeperator, SubNumber and SubSubNumber)

    So I figured the cleanest & easiest way to do this was to define 5 dependency properties on the custom column, 1 for each property, so that I could bind to them in my xaml code:

    <MyCustomColumn NumberBinding="{Binding Number}" NumberSeperatorBinding="{Binding NumberSeperator}" SubNumberBinding="{Binding SubNumber}" SubSubNumberBinding="{Binding SubSubNumber}" />

    So my column looked a bit like this:

    public class MyCustomColumn : GridViewBoundColumnBase
        public Binding NumberBinding
            get { return (Binding)GetValue(NumberBindingProperty); }
            set { SetValue(NumberBindingProperty, value); }
        public static readonly DependencyProperty NumberBindingProperty =
            DependencyProperty.Register("NumberBinding", typeof(Binding), typeof(MyCustomColumn), new PropertyMetadata(null));
        public Binding NumberSeperatorBinding
            get { return (Binding)GetValue(NumberSeperatorBindingProperty); }
            set { SetValue(NumberSeperatorBindingProperty, value); }
        public static readonly DependencyProperty NumberSeperatorBindingProperty =
            DependencyProperty.Register("NumberSeperatorBinding", typeof(Binding), typeof(MyCustomColumn), new PropertyMetadata(null));
        public Binding SubNumberBinding
            get { return (Binding)GetValue(SubNumberBindingProperty); }
            set { SetValue(SubNumberBindingProperty, value); }
        public static readonly DependencyProperty SubNumberBindingProperty =
            DependencyProperty.Register("SubNumberBinding", typeof(Binding), typeof(MyCustomColumn), new PropertyMetadata(null));
        public Binding SubSubNumberBinding
            get { return (Binding)GetValue(SubSubNumberBindingProperty); }
            set { SetValue(SubSubNumberBindingProperty, value); }
        public static readonly DependencyProperty SubSubNumberBindingProperty =
            DependencyProperty.Register("SubSubNumberBinding", typeof(Binding), typeof(MyCustomColumn), new PropertyMetadata(null));

    So when overriding the CreateCellEditElement function, I implemented is as such:

    public override FrameworkElement CreateCellEditElement(GridViewCell cell, object dataItem)
        var e1 = new RadMaskedNumericInput();
        e1.SetBinding(RadMaskedNumericInput.ValueProperty, NumberBinding);
        var e2 = new RadMaskedTextInput();
        e2.SetBinding(RadMaskedTextInput.ValueProperty, NumberSeperatorBinding);
        var e3 = new RadMaskedNumericInput();
        e3.SetBinding(RadMaskedNumericInput.ValueProperty, SubNumberBinding);
        var e4 = new RadMaskedTextInput();
        e4.SetBinding(RadMaskedTextInput.ValueProperty, SubSubNumberBinding);
        var wp = new WrapPanel();
        return wp;

    However, when using this column it will complain that it can't find the Number, NumberSeperator, SubNumber and SubSubNumber properties on the viewmodel, which is the datacontext of the grid.

    I thought it would work the same as the DataMemberBinding and automatically use as datacontext, the row item.

    Any help would be appreciated :)
  2. Tobania
    Tobania avatar
    160 posts
    Member since:
    Apr 2010

    Posted 17 Dec 2013 Link to this post

    Any ideas?
  3. Dimitrina
    Dimitrina avatar
    3769 posts

    Posted 18 Dec 2013 Link to this post


    You just set the DataContext for RadGridView. 

    In order to have the DataContext of each GridViewRow to be an object from the bound collection, you need to have set an ItemsSource collection for RadGridView.

    To get the Binding still be resolved in your case, you could specify a valid Source for it. You can define the MyItemViewModel as a StaticResource and then set it as a Source.

    Learn what features your users use (or don't use) in your application. Know your audience. Target it better. Develop wisely.
    Sign up for Free application insights >>
  4. Pablo
    Pablo avatar
    8 posts
    Member since:
    Feb 2016

    Posted 22 Jun 2016 Link to this post


    I have the same problem. Did you find a solution?

  5. Stefan
    Stefan avatar
    791 posts

    Posted 23 Jun 2016 Link to this post

    Hi Pablo,

    Can you please check out the Create Custom Column Editor and Create Custom Editor topics, as I believe you will find them helpful on this matter?

    Hope this helps.

    Best Regards,
    Stefan X1
    Do you need help with upgrading your AJAX, WPF or WinForms project? Check the Telerik API Analyzer and share your thoughts.
  6. Sdfg
    Sdfg avatar
    1 posts
    Member since:
    Jan 2017

    Posted 26 Jan Link to this post

    Did anyone solve this? I have the same problem.

    Regarding suggested solutions;

    Dimitrina: The question about datacontext is for the context of the binding in the custom column, not for the gridview.

    Stefan X1: Those topics doesn't cover this scenario creating a new bindable property for the column that should bind on the child elements like the datamemberbinding does.


Back to Top