DataGrid: Popup in RowDetails

03-03-2009 1:02 AM |

Hey!

I have the following situation: Inside my datagrid I have defined a datatemplate for the rowdetails. And inside that template there is a popup opened by the click of a button. I can close the popup by pressing a special button inside the template. So far so good. What I now need is the popup to be closed when rowdetails are closed (I use "visible when selected" as RowDetailsVisibilityMode). Does anyone have an idea how to realize that?

THX

Re: DataGrid: Popup in RowDetails

03-03-2009 9:41 AM |

 You can use DataGrid RowDetailsVisibilityChanged event to close the Popup.

Check sample below:

Xaml:

        <data:DataGrid  
            x:Name="myDataGrid" 
            RowDetailsVisibilityChanged="myDataGrid_RowDetailsVisibilityChanged" >
        </data:DataGrid>

Xaml.cs:

        private void myDataGrid_RowDetailsVisibilityChanged(object sender, DataGridRowDetailsEventArgs e)
        {
            if (e.Row.DetailsVisibility == Visibility.Collapsed)
                myPopup.IsOpen = false;
        }

Re: DataGrid: Popup in RowDetails

03-03-2009 9:51 AM |

Sorry, but my popup is inside the rowdetails template. And DataGridRow gives me no possibility to access to its details and the included controls.

Re: DataGrid: Popup in RowDetails

03-03-2009 11:24 AM |

Can you send me the code?

Re: DataGrid: Popup in RowDetails

03-17-2009 6:28 AM |

Sorry for the long break, had a lot of other work to do. But now here's my code:

RowDetailsControl.xaml:

<UserControl x:Class="PopupInGridRowDetails.RowDetailsControl"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Width="400" Height="200">
    <Grid x:Name="LayoutRoot" Background="White">
        <StackPanel Orientation="Horizontal">
            <Button x:Name="OpenPopupButton" Width="100" Height="20" Content="Open Popup"></Button>
            <Popup x:Name="myPopup" Margin="0,50,0,0">
                <Rectangle Fill="Blue" Width="200" Height="100"></Rectangle>
            </Popup>
        </StackPanel>
    </Grid>
</UserControl>

RowDetailsControl.xaml.cs:

    public partial class RowDetailsControl : UserControl
    {
        public RowDetailsControl()
        {
            InitializeComponent();
            this.OpenPopupButton.Click += new RoutedEventHandler(OpenPopupButton_Click);
        }

        private void OpenPopupButton_Click(object sender, RoutedEventArgs e)
        {
            this.myPopup.IsOpen = !this.myPopup.IsOpen;
        }
    }

Page.xaml:

<UserControl x:Class="PopupInGridRowDetails.Page"
                    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                    xmlns:data="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Data"
                    xmlns:this="clr-namespace:PopupInGridRowDetails">

    <UserControl.Resources>
        <DataTemplate x:Key="RowDetails">
            <StackPanel Orientation="Horizontal">
                <this:RowDetailsControl></this:RowDetailsControl>
            </StackPanel>
        </DataTemplate>
    </UserControl.Resources>

    <Grid x:Name="LayoutRoot">
        <StackPanel Orientation="Horizontal">
            <data:DataGrid AutoGenerateColumns="False"
                                   x:Name="myGrid"
                                   GridLinesVisibility="Horizontal"
                                   RowDetailsVisibilityMode="VisibleWhenSelected"
                                   Width="400"
                                   Height="400"
                                   HorizontalAlignment="Left"
                                   RowDetailsTemplate="{StaticResource RowDetails}">
                <data:DataGrid.Columns>
                    <data:DataGridTextColumn Header="Column 1" Binding="{Binding Path=T1}" Width="199"></data:DataGridTextColumn>
                    <data:DataGridTextColumn Header="Column 2" Binding="{Binding Path=T2}" Width="199"></data:DataGridTextColumn>
                </data:DataGrid.Columns>
            </data:DataGrid>
        </StackPanel>
    </Grid>
</UserControl>

Page.xaml.cs:

    public partial class Page : UserControl
    {
        public Page()
        {
            InitializeComponent();

            List<Data> daten = new List<Data>();

            Data date;

            date = new Data();
            date.T1 = "Text 1.1";
            date.T2 = "Text 1.2";
            daten.Add(date);

            date = new Data();
            date.T1 = "Text 2.1";
            date.T2 = "Text 2.2";
            daten.Add(date);

            this.myGrid.ItemsSource = daten;
        }
    }

    public class Data : INotifyPropertyChanged
    {
        private string t1;
        public string T1
        {
            get
            {
                return t1;
            }

            set
            {
                t1 = value;
                this.SetPropertyChangedEvent("T1");
            }
        }

        private string t2;
        public string T2
        {
            get
            {
                return t2;
            }

            set
            {
                t2 = value;
                this.SetPropertyChangedEvent("T2");
            }
        }

        #region PropertyChanged-Event
        public event PropertyChangedEventHandler PropertyChanged;

        private void SetPropertyChangedEvent(string object_name)
        {
            if (this.PropertyChanged != null)
            {
                this.PropertyChanged(this, new PropertyChangedEventArgs(object_name));
            }
        }
        #endregion
    }

What I now want is the popup inside RowDetailsControl to be closed if open and if detail in the grid is closed. Hope you got me.

Re: DataGrid: Popup in RowDetails

03-17-2009 3:09 PM |

You can use the UnloadingRowDetails event to close any open popup.

Re: DataGrid: Popup in RowDetails

03-17-2009 3:10 PM |

Ah yes, use both UnloadingRowDetails and RowDetailsVisibilityChanged

Re: DataGrid: Popup in RowDetails

03-18-2009 4:16 AM |

Ok, RowDetailsVisibilityChanged might be a possibility. But sorry, UnloadingRowDetails is never fired (as already mentioned in some other posts). Can anyone tell me what that event is for?

Re: DataGrid: Popup in RowDetails

03-18-2009 1:10 PM |

UnloadingRowDetails is raised when a RowDetails is scrolled out of view