Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to programmatically add columns to wpf datagrid with MVVM?

Tags:

mvvm

wpf

datagrid

I wanna create a pivot table in the user interface in a WPF with MVVM application. So the number of columns are not static.

I have found that I can programmatically add columns from the code behind file (as shown in below code snippets).

myDataGrid.Columns.Add(column );

But I don't wanna use the code behind file. I wanna do this with MVVM (from the view model). Can anyone give me a solution for this?

like image 292
Haritha Avatar asked Apr 02 '13 04:04

Haritha


1 Answers

I found the solution.

The Answer is simple.

  1. Define a DataTable in the view model
  2. Define columns (In my case I had to define columns programmatically within a foreach loop)
  3. Add rows
  4. Then bind the DataTable for the ItemsSource property of the datagrid. (Make sure that the AutoGeneratedColumns=True)

My View Model

private DataTable sizeQuantityTable;

public DataTable SizeQuantityTable
    {
        get
        {
            return sizeQuantityTable;
        }
        set
        {
            sizeQuantityTable = value;
            NotifyPropertyChanged("SizeQuantityTable");
        }
    }

I have assinged dummy data in the constructor

public MainViewModel()
{
        this.SizeQuantityTable = new DataTable();

        DataColumn sizeQuantityColumn = new DataColumn();
        sizeQuantityColumn.ColumnName = "Size Quantity";
        this.SizeQuantityTable.Columns.Add(sizeQuantityColumn);

        DataColumn sColumn = new DataColumn();
        sColumn.ColumnName = "S";
        this.SizeQuantityTable.Columns.Add(sColumn);

        DataColumn mColumn = new DataColumn();
        mColumn.ColumnName = "M";
        this.SizeQuantityTable.Columns.Add(mColumn);

        DataRow row1 = this.SizeQuantityTable.NewRow();
        row1[sizeQuantityColumn] = "Blue";
        row1[sColumn] = "12";
        row1[mColumn] = "15";
        this.SizeQuantityTable.Rows.Add(row1);

        DataRow row2 = this.SizeQuantityTable.NewRow();
        row2[sizeQuantityColumn] = "Red";
        row2[sColumn] = "18";
        row2[mColumn] = "21";
        this.SizeQuantityTable.Rows.Add(row2);

        DataRow row3 = this.SizeQuantityTable.NewRow();
        row3[sizeQuantityColumn] = "Green";
        row3[sColumn] = "24";
        row3[mColumn] = "27";
        this.SizeQuantityTable.Rows.Add(row3);

        DataRow row4 = this.SizeQuantityTable.NewRow();
        row4[sizeQuantityColumn] = "Yellow";
        row4[sColumn] = "30";
        row4[mColumn] = "33";
        this.SizeQuantityTable.Rows.Add(row4);
    }

My view

<Window x:Class="Pivot.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:vm="clr-namespace:Pivot.ViewModels"
        Title="MainWindow" Height="350" Width="525">
    <Grid>

        <Grid.DataContext>
            <vm:MainViewModel />
        </Grid.DataContext>

        <DataGrid 
            ItemsSource="{Binding SizeQuantityTable}"
            AutoGenerateColumns="True"
            />

    </Grid>
</Window>
like image 148
Haritha Avatar answered Oct 08 '22 15:10

Haritha