Column Reorder in Datagrid

Question

I use the Datagrid for display the records in Silverlight.I use Itemsource for bind the Data in DataGrid. It was working fine.

I form the Grid Like,

Grid x:Name="LayoutRoot" Background="White" Margin="-157,-45,-318,0">

       <sdk:DataGrid HorizontalAlignment="Left" Height="242.195"                                        
                     Margin="93.282,26.764,0,0" VerticalAlignment="Top" 
                     Width="496.08" RenderTransformOrigin="0.5,0.5"
                     UseLayoutRounding="False" d:LayoutRounding="Auto" Name="showrecordgrid" >

           <sdk:DataGrid.Columns>
                <sdk:DataGridTemplateColumn>
                    <sdk:DataGridTemplateColumn.CellTemplate>
                        <DataTemplate>
                            <Button >Edit</Button>
                        </DataTemplate>
                    </sdk:DataGridTemplateColumn.CellTemplate>
                </sdk:DataGridTemplateColumn>

                <sdk:DataGridTemplateColumn>
                    <sdk:DataGridTemplateColumn.CellTemplate>
                        <DataTemplate>
                            <Button >Delete</Button>
                        </DataTemplate>
                    </sdk:DataGridTemplateColumn.CellTemplate>
                </sdk:DataGridTemplateColumn>
            </sdk:DataGrid.Columns>

            <sdk:DataGrid.RenderTransform>
                <CompositeTransform Rotation="-0.566"/>
            </sdk:DataGrid.RenderTransform>


        </sdk:DataGrid>

The Buttons will shows in the starting of the Column.I need to reorder the button in the end of the column?

Refer the ScreenShot, enter image description here

@Bahman_Aries Please check my xaml code now.I wrongly mentioned column name in Edit and delete button Place. — V.V
@Bahman_Aries I use the above code part now the buttons will show in between Column1 and C2 — V.V
@Bahman_Aries I change everything in display area but the button couldnt show in last — V.V

Bahman_Aries Bahman_Aries · Accepted Answer · 2015-07-13T07:28:22

You can use AutoGeneratedColumns event to reorder the columns. First set some header names for your columns like this:

   <sdk:DataGrid ItemsSource="{Binding YourItems}" AutoGeneratedColumns="DataGrid_AutoGeneratedColumns" Name="showrecordgrid" ...>

       <sdk:DataGrid.Columns>
            <sdk:DataGridTemplateColumn Header="Edit">
                <sdk:DataGridTemplateColumn.CellTemplate>
                    <DataTemplate>
                        <Button >Edit</Button>
                    </DataTemplate>
                </sdk:DataGridTemplateColumn.CellTemplate>
            </sdk:DataGridTemplateColumn>

            <sdk:DataGridTemplateColumn Header="Delete">
                <sdk:DataGridTemplateColumn.CellTemplate>
                    <DataTemplate>
                        <Button >Delete</Button>
                    </DataTemplate>
                </sdk:DataGridTemplateColumn.CellTemplate>
            </sdk:DataGridTemplateColumn>
        </sdk:DataGrid.Columns>

Then find those columns by their header and reorder them to be the last:

    private void DataGrid_AutoGeneratedColumns(object sender, EventArgs e)
    {
        var grid = (DataGrid)sender;
        foreach (var item in grid.Columns)
        {
            if (item.Header.ToString() == "Edit")
            {
                item.DisplayIndex = grid.Columns.Count - 1;
            }
            else if (item.Header.ToString() == "Delete")
            {
                item.DisplayIndex = grid.Columns.Count - 2;
            }
        }
    }

Column Reorder in Datagrid

1 Answers