How to provide the ID to the Textbox that is inside the Datagrid's datatemplate in wpf in mvvm model, So that I can differentiate the textbox

Question

In My WPF Application I am using MVVM Model. Datagrid Contains Textbox and Label, when provide the input at the run time in the Textbox, dynamically a description will show in label as per the input in the same row.

But the problem is when I provided the input to a textbox, all the textbox with in the datagrid reflect the same input value as their id is not different in grid. how can I solve this problem.

<Grid>
    <DataGrid Name="c1DataGrid1" ItemsSource="{Binding CreditInfo}" AutoGenerateColumns="False" CanUserAddRows="False">
        <DataGrid.Columns>

            <DataGridTextColumn  Header="Credit" Binding="{Binding Path=Credit}"/>
            <DataGridTemplateColumn Header="Percentage">
                <DataGridTemplateColumn.CellTemplate>
                    <DataTemplate>
                        <Grid>

                            <TextBox Text="{Binding Path=DataContext.CreditPercentage, RelativeSource={RelativeSource AncestorType={x:Type DataGrid}}}" />
                            <b:Interaction.Triggers>
                                <b:EventTrigger EventName="LostFocus">
                                    <b:InvokeCommandAction  Command="{Binding Path= DataContext.LostFocusCommand, RelativeSource={RelativeSource AncestorType={x:Type DataGrid}}}" CommandParameter="{Binding}">                                          
                                    </b:InvokeCommandAction>
                                </b:EventTrigger>
                            </b:Interaction.Triggers>
                        </Grid>
                    </DataTemplate>
                </DataGridTemplateColumn.CellTemplate>
            </DataGridTemplateColumn>
            <DataGridTemplateColumn Header="Description">
                <DataGridTemplateColumn.CellTemplate>
                    <DataTemplate>
                        <Grid>
                            <TextBlock Width="440" Text="{Binding PercentageDescription}"/>
                        </Grid>
                    </DataTemplate>
                </DataGridTemplateColumn.CellTemplate>
            </DataGridTemplateColumn>
        </DataGrid.Columns>
    </DataGrid>
</Grid> 

Answer 1

If I've understood your code correctly you have a grid with 3 columns. The first column contains some value the second column contains textbox where you can insert a value and the third column contains a textbox that calculates percentage of the first column value taking second column value as the percent.

ie you have Credit=50 you type 10 into the second column's textbox and you want 5 to appear in the third column.

If that's correct then there is an easier way to achieve what you want.

You create two new properties in the view model for the items bound to your grid. The first property will contain whatever is entered into the textbox of the second column:

    private int _creditPercentage;

    public int CreditPercentage
    {
        get { return _creditPercentage; }
        set
        {
            if (value == _creditPercentage)
                return;

            _creditPercentage= value;
            OnPropertyChanged("CreditPercentage");
            OnPropertyChanged("PercentageDescription");
        }
    }

The second property is going to contain the result of the calculation:

public String PercentageDescription
{
    get { return Convert.ToString(Math.Round((double)Credit*Percentage/100), CultureInfo.InvariantCulture); }
}

Now you bind the Percentage property to your TextBox in the second column. And PercentageDescription to your third column:

<DataGridTemplateColumn Header="Percentage">
            <DataGridTemplateColumn.CellTemplate>
                <DataTemplate>
                    <TextBox Text="{Binding CreditPercentage}" />
                </DataTemplate>
            </DataGridTemplateColumn.CellTemplate>
        </DataGridTemplateColumn>

<DataGridTextColumn  Header="Description" Binding="{Binding Path=PercentageDescription}"/>

You might also want to implement some input validation in that textbox in the second column to insure that user can only enter digits.

Answer 2

its worked for me by applying the OnPropertyChanged("CreditPercentage"); in the creditinfo property, also define the percentageDescription property in creditmodel.

 public ObservableCollection<Credits> CreditInfo
    {
        get
        {
            return infos;
        }
        set
        {

            infos = value;
            OnPropertyChanged("CreditInfo");
            OnPropertyChanged("CreditPercentage");
            //OnPropertyChanged("PercentageDescription");
        }
    }public string PercentageDescription
    {
        get
        {
            return percentageDescription;
        }
        set
        {
            percentageDescription = value;
            OnPropertyChanged("PercentageDescription");
        }
    }