Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Editable DataGrid - CanUserAddRows="True" not working

I have the following DataGrid:

 <DataGrid ItemsSource="{Binding EmployeeList}" CanUserAddRows="True" AutoGenerateColumns="False" Margin="0,0,0,90">
        <DataGrid.Columns>
            <DataGridTemplateColumn Header="CountryCombo2">
                <DataGridTemplateColumn.CellTemplate>
                    <DataTemplate>
                        <ComboBox ItemsSource="{Binding Path=DataContext.CountryList, RelativeSource={RelativeSource AncestorType={x:Type Window}}}" 
                                      DisplayMemberPath="CountryName" 
                                      SelectedItem="{Binding EmployeeCountry, Mode=TwoWay}"
                                      SelectedValue="{Binding EmployeeCountry.CountryId}"
                                      SelectedValuePath="CountryId" />
                    </DataTemplate>
                </DataGridTemplateColumn.CellTemplate>
            </DataGridTemplateColumn>
        </DataGrid.Columns>
    </DataGrid>

However, I am unable to add new rows to the DataGrid. Please let me know if I need to provide any additional code.

Update :

Screen 1 : This is the screenshot when the window is just loaded with the hardcoded property values. Now I see the empty new row.

Screen 1

Screen 2 : Here I have added data into the new row with values Rambo and Russia. Now, no matter what I do (tab-out, click in another cell), the next new row is not added. I believe it should be adding a new row.

Screen 2

Screen 3 : Here the newly added row values have disappeared. That is because I double clicked on the thin border between the two empty cells. Now this is pretty weird.

Screen 3

Screen 4 : Now when I click on the Peter cell, the previously entered row data is back but now it is pushed down and a new empty row is inserted before it. This is very strange.

Screen 3

Can anyone please help me understand this behavior of the DataGrid?

like image 415
Lucifer Avatar asked Mar 11 '14 15:03

Lucifer


3 Answers

In my case,

First ensure your ItemSource is not using an array that can't add new item to it,

use something like List that can add newItem,

Besides, the SomeClass should have an default constructor takes no parameters like

List<SomeClass>();

public Class SomeClass
{       
  public SomeClass() { }
}

then the new empty row appear in the bottom of the DataGrid.

Refer to this answer.

like image 69
yu yang Jian Avatar answered Oct 20 '22 08:10

yu yang Jian


I'm going ahead and posting this as an answer here as I need to post a code sample and the comments are starting to become extended (got the invite-to-chat message).

The answer to the original question was ensure that the Type T of the ItemsSource had a parameterless constructor.

Try this code attached to the DataGrid's BeginningEdit event to swallow up the cell border clicks:

private void Grid_BeginningEdit(object sender, DataGridBeginningEditEventArgs e)
{
    //// Have to do this in the unusual case where the border of the cell gets selected
    e.Cancel = true;
}

If you are actually using this handler for something else, or intend to, you can check the OriginalSource to see if it is a Border and cancel the event on that condition.

like image 4
ouflak Avatar answered Oct 20 '22 07:10

ouflak


Use DataGridTextColumn and DataGridComboBoxColumn instead DataGridTemplateColumn, then rows will be added by adequately.

If you want to use DataGridTemplateColumn, then set not only the CellTemplate, but CellEditingTemplate. For example:

<DataGridTemplateColumn Header="Pick a Date">
<DataGridTemplateColumn.CellTemplate>
    <DataTemplate>
        <TextBlock Text="{Binding myDate}" />
    </DataTemplate>
</DataGridTemplateColumn.CellTemplate>
<DataGridTemplateColumn.CellEditingTemplate>
    <DataTemplate>
        <DatePicker SelectedDate="{Binding myDate}" />
    </DataTemplate>
</DataGridTemplateColumn.CellEditingTemplate>

like image 3
Mentor Avatar answered Oct 20 '22 09:10

Mentor