J. Doe
J. Doe

Reputation: 167

How to add manually a button on a DataGrid's end in pure XAML?

I've got a DataGrid with some columns:

<DataGrid.Columns>
    <DataGridTextColumn Header="Date" Binding="{Binding Date}, Mode=OneWay}"></DataGridTextColumn>
     //9 DataGridTextColumn more
</DataGrid.Columns>

I'd like to append a button at the end of the DataGrid. Regardless how many rows there are, the button should be "the last row" with colspan over all columns. I've tried something, but it didnt work:

//</DataGrid.Columns>
<local:MyRecord Date="" ....>
    <Button Grid.ColumnSpan="10" VerticalAlignment="Bottom" Click="Button1_Clicked" >Load More</Button>
</local:MyRecord>

The code behind Looks like this:

public class MyRecord{
    public string Date{ get; set;} 
    //...
}

How is it possible to append/add a button at the end of my DataGrid? Is it possible in pure XAML?

Upvotes: 2

Views: 804

Answers (1)

Na Me
Na Me

Reputation: 389

First, you need to use a ScrollViewer and a StackPanel. Put them around your DataGrid:

<ScrollViewer VerticalScrollBarVisibility="Auto" HorizontalScrollBarVisibility="Auto">
    <StackPanel>
        <DataGrid>
            ///Content goes here...
        </DataGrid>
        <Button Height="Auto" ....></Button>
    </StackPanel>
</ScrollViewer>

In your DataGrid, you'll need a (DataGrid.)Template:

<DataGrid RowHeaderWidth="0">
    <DataGrid.Template>
        <ControlTemplate>
            <StackPanel Orientation="Vertical">
                <DataGridColumnHeadersPresenter />
                <ItemsPresenter />
        </ControlTemplate>
    </DataGrid.Template>
</DataGrid>

Now, the DataGrid uses the ScrollViewer to enable scrolling.

Upvotes: 2

Related Questions