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

Control Expander on SelectionChanged event

1 Answer 236 Views
GridView
This is a migrated thread and some comments may be shown as answers.
Clinton van Ry
Top achievements
Rank 1
Clinton van Ry asked on 27 Aug 2009, 04:14 PM
Hi,

I have WPF 2009 SP2 (2009.2.701.35). I am attempting to control the expander (+ - ) on the grid. I use the following event

PreviewDataRecordCreate for the intialization of the grid to control the expander which works well. However i would like to validate the expander when the user selects the row (selectinchanged event)
I have tried to cast to the ExpandableDataRecord but this is always null. I would like validate that the expander is valid i.e. i do have data for the child grid. I am currently calling a rebind of the grid view but this does not help. I dont want to remove the row and re-add it as that seems to be a hack.

Secondly is there an event when the user clicks on the expander (+-) as this does cause a selectionchanged event?

The last question is that there is allot of classes marked as deprecated such as ExpandableDataRecord is there mechanism to look at which classes we should use instead as the forum posts would refer to the old classes?

Kind Regards,

Clinton

1 Answer, 1 is accepted

Sort by
0
Rossen Hristov
Telerik team
answered on 31 Aug 2009, 09:57 AM
Hi Clinton van Ry,

My advice is to use the new feature called Row Details. In my blog post, I have attached a small sample project that demonstrates how to display hierarchy by using Row Detail. The project is for Silverlight, but since we share the same code base between WPF and Silverlight it should be exactly the same.

Let me explain what the project does. First of all, the RowDetailsTemplate is used for showing a details grid. RadGridView has three built-in modes for displaying Row Details -- Collapsed, Visible and VisibleWhenSelected. But the visibility of each row's details can be manually controlled through the DetailsVisibility property of GridViewRow.

In my example, I am controlling the visibility of each row's details through a toggle button which is placed in a special grid column on the left. This makes it look the same as if you are using the HierarchyChildTemplate approach. Of course you can customize the toggle button in any way that you want.

I have prepared a small sample WPF project with all of your requirements. Here is how I have achieved your first requirement -- to decide whether there will be a plus button when the row is selected:

using System.Windows.Controls; 
using System.Windows.Controls.Primitives; 
using System.Windows.Data; 
using Telerik.Windows.Controls.GridView; 
 
namespace TicketID_238397_ToggleRowDetails 
    internal class DetailsToggleButton : ToggleButton 
    { 
        private readonly GridViewRow parentRow; 
 
        public DetailsToggleButton(GridViewRow parentRow) 
        { 
            this.parentRow = parentRow; 
            this.Visibility = System.Windows.Visibility.Collapsed; 
            this.parentRow.Selected += this.OnParentRowSelected; 
 
            this.Init(); 
        } 
 
        void OnParentRowSelected(object sender, System.Windows.RoutedEventArgs e) 
        { 
            Club club = (Club)this.parentRow.DataContext; 
            if (club.Players.Count > 0) 
            { 
                this.Visibility = System.Windows.Visibility.Visible; 
            } 
        } 
 
        private void Init() 
        { 
            // Make our toggle button expand/collapse the details. 
            var b1 = new Binding("IsChecked"
                         { 
                             Source = this
                             Mode = BindingMode.TwoWay, 
                             Converter = new BooleanToVisibilityConverter() 
                         }; 
            this.parentRow.SetBinding(GridViewRow.DetailsVisibilityProperty, b1); 
 
            // Changed the plus/minus sign based. 
            var b2 = new Binding("IsChecked"
                         { 
                             Source = this
                             Mode = BindingMode.OneWay, 
                             Converter = new CheckedToSymbolConverter() 
                         }; 
            this.SetBinding(ContentControl.ContentProperty, b2); 
        } 
    } 

I made the toggle button hidden by default. When its parent row is being selected, it will check whether there are child data and if so -- make itself visible. For the sake of example, I have left the Chelsea squad without any players. I chose Chelsea purely randomly, for the sake of demonstration of a row without any child data (Players in this case).

As for the second requirement. The grid has an event called RowDetailsVisibilityChanged. As you can expect it is fired each time some details are being shown or hidden. The event args will give you the GridViewRow for which the details have been shown/hidden and their new state. This will let you do something custom. If you are planning to do some heavy work only once the first time details are loaded, you can attach to the LoadingRowDetails event of the grid. It will be fired only once the first time you want to see some row details. From then on you will be receiving the RowDetailsVisibilityChanged event when they are shown or hidden.

        private void OnRowDetailsVisibilityChanged(object sender, Telerik.Windows.Controls.GridView.GridViewRowDetailsEventArgs e) 
        { 
            MessageBox.Show(string.Format("Details for row containing {0} have been {1}" 
                , ((Club) e.Row.DataContext).Name 
                , e.Visibility == System.Windows.Visibility.Visible ? "shown" : "hidden")); 
        } 
 

The third question is now obsolete. You can always get the data item from the GridViewRow.DataContext. This same Club would also be the DataContext of the control that is used for RowDetailsTemplate, in our case this would be the ClubDetailsControl. So I do not think that you will need the obsolete class anymore.

Please, examine the project I have attached. You can use it as a foundation and build upon it. The main thing to remember is that you can leave the grid to hide/show details upon selection with the VisibleWhenSelected mode OR you can manually fine tune this process by setting the grid's mode to Collapsed (as in my example) and then commanding each individual row through its DetailsVisibility property. I hope that you will like this new approach, which I think is more flexible.

Please, let me know if you have any trouble with the sample project or with your original project. I would be glad to help you.

Kind regards,
Ross
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
Tags
GridView
Asked by
Clinton van Ry
Top achievements
Rank 1
Answers by
Rossen Hristov
Telerik team
Share this question
or