How to display the row number?

9 posts, 1 answers
  1. Wagner
    Wagner avatar
    17 posts
    Member since:
    Feb 2010

    Posted 16 Jun 2010 Link to this post

    Hi,

    I have a requirement to display the row number (index of the binded ObservableCollection) similar to how Excel displays rows.  How can I accomplish this behavior?  I looked into different ways, but I didn't have much success.

    Thanks in advance,

    Wagner
  2. Answer
    Pavel Pavlov
    Admin
    Pavel Pavlov avatar
    2039 posts

    Posted 16 Jun 2010 Link to this post

    Hello wdosanjos,

    Please use the approach demonstrated in this online example.
    It is for RadGridView for Silverlight , but the same approach may be used for WPF as both grids share a common codebase and the same API.

    Best wishes,
    Pavel Pavlov
    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.
  3. Wagner
    Wagner avatar
    17 posts
    Member since:
    Feb 2010

    Posted 19 Jun 2010 Link to this post

    Thanks for the link.  The sample displays the index on the grid and I needed the index on the ItemSource collection, but I was able to update the code (below) to provide what I needed.

                <telerik:RadGridView.Columns> 
                    <telerik:GridViewSelectColumn/> 
                    <local:RowNumberColumn Header="Line#"
                        <telerik:GridViewDataColumn.AggregateFunctions> 
                            <telerik:CountFunction Caption="Count: "/> 
                        </telerik:GridViewDataColumn.AggregateFunctions> 
                    </local:RowNumberColumn> 
     

        public class RowNumberColumn : Telerik.Windows.Controls.GridViewDataColumn 
        { 
            public override System.Windows.FrameworkElement CreateCellElement(Telerik.Windows.Controls.GridView.GridViewCell cell, object dataItem) 
            { 
                TextBlock textBlock = cell.Content as TextBlock; 
     
                if (textBlock == null
                { 
                    textBlock = new TextBlock(); 
                } 
     
                //textBlock.Text = (this.DataControl.Items.IndexOf(dataItem) + 1).ToString(); 
                textBlock.Text = ((this.DataControl.ItemsSource as IList).IndexOf(dataItem) + 1).ToString(); 
     
                return textBlock; 
            } 
        } 
     

    Thanks,

    Wagner


  4. Espen Berglund
    Espen Berglund avatar
    1 posts
    Member since:
    May 2010

    Posted 26 Aug 2010 Link to this post

    This index isn't updated when the underlying collection gets an item deleted. Is it possible to achieve that (silverlight 4)?
  5. Milan
    Admin
    Milan avatar
    1989 posts

    Posted 26 Aug 2010 Link to this post

    Hi Espen Berglund,

    You can create a more sophisticated control to plug-in into the RowNumberConlumn which will updated automatically. For example:

    public class RowNumberColumn : Telerik.Windows.Controls.GridViewDataColumn
    {
        public override System.Windows.FrameworkElement CreateCellElement(GridViewCell cell, object dataItem)
        {
            var numberPresenter = cell.Content as RowNumberPresenter;
      
            if (numberPresenter == null)
            {
                numberPresenter = new RowNumberPresenter() { ParentControl = this.DataControl };
            }
      
            return numberPresenter;
        }
    }

    public partial class RowNumberPresenter : UserControl
        {
            private GridViewDataControl parentControl;
      
            public GridViewDataControl ParentControl
            {
                get
                {
                    return this.parentControl;
                }
      
                set
                {
                    if (this.parentControl != null)
                    {
                        this.parentControl.Items.CollectionChanged -= 
                            new NotifyCollectionChangedEventHandler(Items_CollectionChanged);
                    }
      
                    this.parentControl = value;
      
                    if (this.parentControl != null)
                    {
                        this.parentControl.Items.CollectionChanged += 
                            new NotifyCollectionChangedEventHandler(Items_CollectionChanged);
                    }
                }
            }
      
            void Items_CollectionChanged(object sender, NotifyCollectionChangedEventArgs e)
            {
                this.rowNumberText.Text = (this.ParentControl.Items.IndexOf(this.DataContext) + 1).ToString();
            }
      
            public RowNumberPresenter()
            {
                InitializeComponent();
            }
        }

    <UserControl x:Class="GridView.TestApplication.RowNumberPresenter"
                 xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                 xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
              >
        <Grid>
            <TextBlock x:Name="rowNumberText"/>
        </Grid>
    </UserControl>


    All the best,
    Milan
    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
  6. Grr
    Grr avatar
    9 posts
    Member since:
    Sep 2010

    Posted 15 Apr 2011 Link to this post

    This does not seem to be a good solution.

    When I insert a line or delete a line the row index just completely screws up. Is there some way we can override onDraw functionality and set the text to its index?
  7. TheFlo
    TheFlo avatar
    6 posts
    Member since:
    Sep 2012

    Posted 17 Oct 2012 Link to this post

    Hi All,

    Based on Milan's example, I implemented a row number column based on the number of rows in the full grid or the number of rows in a group should you choose to use column grouping.
    Here is the code :

    public class RowNumberGridViewColumn : GridViewColumn
    {
        public override FrameworkElement CreateCellElement(GridViewCell cell, object dataItem)
        {
            var numberPresenter = cell.Content as RowNumberPresenter;
            if (numberPresenter == null)
                numberPresenter = new RowNumberPresenter(this.DataControl, dataItem);
            return numberPresenter;
        }
    }

    public class RowNumberPresenter : TextBlock
    {
        private GridViewDataControl _parentControl;
        public GridViewDataControl ParentControl
        {
            get { return this._parentControl; }
            private set
            {
                if (this._parentControl != null)
                    this._parentControl.Items.CollectionChanged -= new NotifyCollectionChangedEventHandler(Items_CollectionChanged);
                this._parentControl = value;
                if (this._parentControl != null)
                    this._parentControl.Items.CollectionChanged += new NotifyCollectionChangedEventHandler(Items_CollectionChanged);
            }
        }
     
        public RowNumberPresenter(GridViewDataControl parentControl, object dataItem)
            : base()
        {
            ParentControl = parentControl;
            SetText(dataItem);
        }
     
        private void Items_CollectionChanged(object sender, NotifyCollectionChangedEventArgs e)
        {
            SetText(this.DataContext);
        }
     
        private void SetText(object dataItem)
        {
            // in case of grouping, this code is used to display the row number based on the number of items in the grouping
            if (this.ParentControl.IsGrouping)
            {
                var group = this.ParentControl.FindGroupByItem(dataItem);
                if (group != null)
                {
                    var items = group.Items as ReadOnlyObservableCollection<object>;
                    if (items != null)
                        this.Text = (items.IndexOf(dataItem) + 1).ToString();
                }
            }
            if (string.IsNullOrWhiteSpace(this.Text))
                this.Text = (this.ParentControl.Items.IndexOf(dataItem) + 1).ToString();
        }
    }

    Hope this help,

    TheFlo
  8. John
    John avatar
    7 posts
    Member since:
    Aug 2013

    Posted 22 Aug 2013 Link to this post

    Hi - can't get this solution to work in WPF. Of course mine is a specific application so my namespace is different. - in my case it is PDDashboard - and the RadGridView is in a User Control called UserControl1 -

    In UserControl1.xaml there is xmlsn:custom="clr-namespace:PDDashboard"

    and in my telerik:RadGridView.Columns there is custom:MyColumn

    and I made a class in the Project and called it MyColumn

    However I get "The name MyColumn does not exist in the namespace....

    whether or not I include the clr-namespace in the xaml file.

    What gives? Do I need to add a reference or something in VS?

    I will attach code if need be but it seems as if I have spelled it all out...no?

  9. Saykor
    Saykor avatar
    70 posts
    Member since:
    Feb 2011

    Posted 03 Sep 2014 Link to this post

    Hi all,
    Good to know:

    The example for MyColumn.cs in http://demos.telerik.com/silverlight/#GridView/RowNumber not work if I want to add new item.
    Allow user to insert new items and you will see that the numbers is not change.

    The solution provided from TheFlo is working on insert new item if we remove the line: 
    if (string.IsNullOrWhiteSpace(this.Text))

    But we lost item number if user sort a column. Fast fix:

    if (numberPresenter == null)
                    numberPresenter = new RowNumberPresenter(this.DataControl, dataItem);
                else
                    numberPresenter.SetText(dataItem);

    To reset TextBox.Text value on column sort

    Regards,
    Saykor

Back to Top