We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

How to load the button command inside the Detailsview WPF DataGrid (SfDataGrid) column and setting AncestorLevel ?

Platform: WPF |
Control: SfDataGrid |
.NET Framework: 4.5

You can load button for a column using GridTemplateColumn in WPF DataGrid (SfDataGrid). You can refer the below article which explains how to bind the button to the command in ViewModel in SfDataGrid.

Reference link: https://www.syncfusion.com/kb/5904

This article explains about how to bind the button with command in ViewModel for details view DataGrid. The DataContext of GridViewDefinition.DataGrid is not same as WPF DataGrid (SfDataGrid). So, you can bind the button to the command in ViewModel using Ancestor binding as in the below code snipet,

XAML

<syncfusion:SfDataGrid
 x:Name="dataGrid" ColumnSizer="Star"
 ItemsSource="{Binding Path=OrdersDetails}">
    <syncfusion:SfDataGrid.DetailsViewDefinition>
        <syncfusion:GridViewDefinition RelationalColumn="OrderDetails">
            <syncfusion:GridViewDefinition.DataGrid>
                <syncfusion:SfDataGrid x:Name="FirstDetailsViewGrid">
                    <syncfusion:SfDataGrid.Columns>
                        <syncfusion:GridTemplateColumn MappingName="CustomerID">
                            <syncfusion:GridTemplateColumn.CellTemplate>
                                <DataTemplate>
                                     <Button 
                                           Command="{Binding  Path=DataContext.ButtonCommand,                 
                                           RelativeSource={RelativeSource AncestorLevel=2, 
                                           AncestorType=syncfusion:SfDataGrid}}" 
                                           syncfusion:VisualContainer.WantsMouseInput="True"
                                           syncfusion:FocusManagerHelper.FocusedElement="True"
                                           Content="Click" />
                                </DataTemplate>
                            </syncfusion:GridTemplateColumn.CellTemplate>
                        </syncfusion:GridTemplateColumn>
                    </syncfusion:SfDataGrid.Columns>
                </syncfusion:SfDataGrid>
            </syncfusion:GridViewDefinition.DataGrid>
        </syncfusion:GridViewDefinition>
    </syncfusion:SfDataGrid.DetailsViewDefinition>
</syncfusion:SfDataGrid>

ViewModel

public class ViewModel
{
    private ICommand _buttonCommand;
    private List<OrderInfo> _ordersDetails;
    /// <summary>
    /// Initializes a new instance of the <see cref="ViewModel"/> class.
    /// </summary>
    public ViewModel()
    {
        OrderInfoRepository order = new OrderInfoRepository();
        OrdersDetails = order.GetOrdersDetails(100);
        _buttonCommand = new RelayCommand(ChangeCanExecute);
    }
    public ICommand ButtonCommand
    {
        get { return _buttonCommand; }
    }
    public void ChangeCanExecute(object obj)
    {
        MessageBox.Show("Button Command Executed");
    }
    /// <summary>
    /// Gets or sets the orders details.
    /// </summary>
    /// <value>The orders details.</value>
    public List<OrderInfo> OrdersDetails
    {
        get{ return _ordersDetails; }
        set{ _ordersDetails = value;}
    }
}

 

Load the button command inside the DetailsViewGrid of WPF DataGrid

2X faster development

The ultimate WPF UI toolkit to boost your development speed.
ADD COMMENT
You must log in to leave a comment

Please sign in to access our KB

This page will automatically be redirected to the sign-in page in 10 seconds.

Up arrow icon

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

Live Chat Icon For mobile