MVVM WPF properties - c#

In my WPF project a DataGrid is bound to a collection. When DataGrid row selection changes the corresponding TextBox, should get updated. The DataGrid selected item is bound to a property
SelectedItem="{Binding CardType.SelectedCard}"
and corresponding Text box is bound
Text="{Binding CardType.SelectedCard.LimitBalance}"
so when a selected item is changed, my text box will get updated.
DataGrid
<DataGrid
x:Name="dtGridSearch"
Margin="0,0,8,0"
AutoGenerateColumns="False"
GridLinesVisibility="None"
SelectionMode="Single"
CanUserAddRows="False"
BorderThickness="0"
RowHeaderWidth="0"
RowStyle="{StaticResource TCAS_RowStyle}"
ItemsSource="{Binding CardType.Cards}"
SelectedItem="{Binding CardType.SelectedCard}"
SelectionChanged="dtGridSearchSelectionChanged">
<DataGrid.Columns>
<DataGridTextColumn x:Name="CardCode" Binding="{Binding CardId}" HeaderStyle="{StaticResource DataGridColumnHeaderStyle}" IsReadOnly="True" Width="150" CanUserResize="False" >
<DataGridTextColumn.Header>
<TextBlock x:Name="tbCardCode" Text=""/>
</DataGridTextColumn.Header>
</DataGridTextColumn>
<DataGridTextColumn x:Name="CardName" Binding="{Binding CardDescription}" HeaderStyle="{StaticResource DataGridColumnHeaderStyle}" IsReadOnly="True" Width="250" CanUserResize="False" >
<DataGridTextColumn.Header>
<TextBlock x:Name="tbCardName" Text="" HorizontalAlignment="Center"/>
</DataGridTextColumn.Header>
</DataGridTextColumn>
<DataGridTextColumn x:Name="ProductCode" Binding="{Binding ProductTypeCode}" HeaderStyle="{StaticResource DataGridColumnHeaderStyle}" IsReadOnly="True" Width="150" CanUserResize="False" >
<DataGridTextColumn.Header>
<TextBlock x:Name="tbProductCode" Text=""/>
</DataGridTextColumn.Header>
</DataGridTextColumn>
<DataGridTextColumn x:Name="Limitbalance" Binding="{Binding LimitBalance}" HeaderStyle="{StaticResource DataGridColumnHeaderStyle}" IsReadOnly="True" Width="100*" CanUserResize="False" >
<DataGridTextColumn.Header>
<TextBlock x:Name="tbLimitbalance" Text="" HorizontalAlignment="Center"/>
</DataGridTextColumn.Header>
</DataGridTextColumn>
</DataGrid.Columns>
</DataGrid>
TextBox
<TextBox
x:Name="txtLimitbalance"
Grid.Row="3"
Grid.Column="1"
Margin="16,0,0,0"
Style="{StaticResource TMS_TextBox_Base1}"
Text="{Binding CardType.SelectedCard.LimitBalance, Mode=TwoWay}"
MaxLength="45"
Height="24"
Width="210"
TabIndex="4"
PreviewKeyDown="txtLimitbalancePreviewKeyDown"/>
<CheckBox
x:Name="chkused"
Grid.Row="3"
Grid.Column="2"
Margin="16,4,0,8"
Content="{Binding Resources.NPUsed}"
IsChecked="{Binding CardType.SelectedCard.ActiveStatus, Mode=TwoWay}"
TabIndex="5"/>
User update the text box to a different value from original value , so one property of row1 is updated ,now user selected the different row i.e rowenter code here2 from datagrid. again user selected the row1 so it is dispalying updated value not original value. I want to display original value only.

Related

User can not insert into datagrid?

I want to use a three-column datagrid so that the user can enter the data into it and then store the data from the datagrid into the database.
But my problem is that I created DataGrid but I can't enter any data.
<DataGrid VerticalAlignment="Center" VerticalContentAlignment="Center"
HorizontalContentAlignment="Center" HorizontalAlignment="Center"
IsEnabled="{Binding ElementName=chkitems, Path=IsChecked}"
Height="266" x:Name="dgvitems" AutoGenerateColumns="False"
CanUserAddRows="True" CanUserDeleteRows="True"
CanUserReorderColumns="False" CanUserResizeColumns="False"
CanUserSortColumns="False" IsReadOnly="False" Width="451">
<DataGrid.Columns>
<DataGridTextColumn Header="نام کالا" Width="250" FontSize="14" Binding="{Binding name}"/>
<DataGridTextColumn Header="تعداد" Width="80" FontSize="14" Binding="{Binding number}"/>
<DataGridTemplateColumn Header=" ">
<DataGridTemplateColumn.CellTemplate>
<DataTemplate>
<Button x:Name="btndelete" VerticalAlignment="Center" HorizontalAlignment="Center" BorderBrush="{x:Null}" Click="Btndelete_Click" ToolTip="حذف رکورد" Background="{x:Null}">
<materialDesign:PackIcon Kind="CloseCircle" Foreground="Red" Width="16" Height="16" HorizontalAlignment="Center" VerticalAlignment="Center" HorizontalContentAlignment="Center" VerticalContentAlignment="Center"/>
</Button>
</DataTemplate>
</DataGridTemplateColumn.CellTemplate>
</DataGridTemplateColumn>
</DataGrid.Columns>
</DataGrid>
WPF not Support Direct Binding to DataColumns first Learn MVVM Architecture And Used MVVM
pattern ,used ObservableCollection then enter data Datagrid Columns Accept Automatically

Pass value of selected row of datagrid to popup box

I have a popupbox which is shown on every row and when I click on that popup it should show the more details of the selected row. I was able to get values of selected row but I am unable to bind them to popupbox controls.
<DataGrid x:Name="CRDataGrid" AutoGenerateColumns="False" SelectionMode="Single" SelectedItem="{Binding SelectedCR}" FontSize="14" CanUserAddRows="False" ItemsSource="{Binding crentities}"
CanUserDeleteRows="False" md:DataGridAssist.ColumnHeaderPadding="4" md:DataGridAssist.CellPadding="4" SelectionUnit="FullRow" MouseDoubleClick="DataGrid_MouseDoubleClick" RowDetailsVisibilityMode="VisibleWhenSelected" HeadersVisibility="All" Grid.ColumnSpan="2" Grid.Row="1" Margin="20" >
<DataGrid.Columns>
<DataGridTextColumn Header="Title" IsReadOnly="True" Binding="{Binding LogName}" Width="80" />
<DataGridTextColumn Header="MUIdentifier" IsReadOnly="True" Binding="{Binding MU_Identifier}" Width="100" />
<DataGridTextColumn Header="Status" IsReadOnly="True" Binding="{Binding Status}" Width="80" />
<DataGridTextColumn Header="RequestType" IsReadOnly="True" Binding="{Binding RequestType}" Width="100" />
<DataGridTextColumn Header="DateTime" IsReadOnly="True" Binding="{Binding Create_Date,TargetNullValue='-'}" Width="100" />
<DataGridTextColumn Header="SoftwareVersion" IsReadOnly="True" Binding="{Binding SW_Version}" Width="200" />
<DataGridTemplateColumn >
<DataGridTemplateColumn.CellTemplate>
<DataTemplate>
<md:PopupBox DockPanel.Dock="Right" PlacementMode="BottomAndAlignRightEdges" StaysOpen="True">
<md:PopupBox.ToggleContent>
<md:PackIcon Kind="DotsHorizontal" Margin="4 0 4 0" Width="24" Height="24"
Foreground="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType=md:PopupBox}, Path=Foreground}" />
</md:PopupBox.ToggleContent>
<TextBox Grid.Column="1" Grid.Row="1" Text="{Binding ElementName=CRDataGrid, Path= SelectedCR.MU_Identifier}" />
</md:PopupBox>
</DataTemplate>
</DataGridTemplateColumn.CellTemplate>
</DataGridTemplateColumn>
</DataGrid.Columns>
</DataGrid>
Shouldn't
<TextBox Grid.Column="1" Grid.Row="1" Text="{Binding ElementName=CRDataGrid, Path= SelectedCR.MU_Identifier}" />
instead be
<TextBox Grid.Column="1" Grid.Row="1" Text="{Binding ElementName=CRDataGrid, Path= SelectedItem.MU_Identifier}" />
?

WPF DataGrid repeat Headers in all rows

My requirement is to display headers of DataGrid in following format instead of normal grid.
My code for normal DataGrid as follows:
<DataGrid Margin="7.208,8,7.888,8" Grid.Row="2" AutoGenerateColumns="False" Name="gridOrder" BorderBrush="#FFB38807" Background="#FFEDEDEC" HorizontalGridLinesBrush="#FFB38807" VerticalGridLinesBrush="#FFB38807" SelectionChanged="gridOrder_SelectionChanged" CanUserAddRows="False">
<DataGrid.Columns>
<DataGridTextColumn Header="Order ID" Binding="{Binding orderid}" />
<DataGridTextColumn Header=" Order Time" Binding="{Binding orderTime}" />
<DataGridTextColumn Header="Order Status" Binding="{Binding orderStatus}" />
</DataGrid.Columns>
</DataGrid>
Can any one help me out for this kind of requirement.
<DataGrid AutoGenerateColumns="False">
<DataGrid.Columns>
<DataGridTemplateColumn>
<DataGridTemplateColumn.CellTemplate>
<DataTemplate>
<StackPanel>
<StackPanel Orientation="Horizontal">
<TextBlock Text="OrderId : "/>
<TextBlock Text="{Binding OrderId}"/>
</StackPanel>
<StackPanel Orientation="Horizontal">
<TextBlock Text="OrderTime : "/>
<TextBlock Text="{Binding OrderTime}"/>
</StackPanel>
<StackPanel Orientation="Horizontal">
<TextBlock Text="OrderStatus : "/>
<TextBlock Text="{Binding OrderStatus}"/>
</StackPanel>
</StackPanel>
</DataTemplate>
</DataGridTemplateColumn.CellTemplate>
</DataGridTemplateColumn>
</DataGrid.Columns>
</DataGrid>

Combobox in a cell of DataGrid

I have a database with Table name “tblProducts” with columns header “ProductCode, Descriptions, UnitPirce, Quantity, TotalPrice”
I have a DataGrid in my WPF form, and manually create the column headers as below:
<DataGrid x:Name="dataGridOrderedProducts" Margin="10,10,10,0" Grid.Row="3" Grid.ColumnSpan="4" VerticalAlignment="Center" Height="180" BorderThickness="1">
<DataGrid.Columns>
<DataGridTextColumn Header="Product Code" MinWidth="120" FontSize="11"/>
<DataGridTextColumn Header="Descriptions" MinWidth="200" FontSize="11"/>
<DataGridTextColumn Header="Unit Price" MinWidth="100" FontSize="11"/>
<DataGridTextColumn Header="Quantity" MinWidth="100" FontSize="11"/>
<DataGridTextColumn Header="Total Price" MinWidth="100" FontSize="11"/>
</DataGrid.Columns>
</DataGrid>
I want to have a ComboBox in a cell under “Product Code” columns so that users can select a product and query all the related data from that ProductCode.
How can I do that?
You can do this in two- ways,
(i).By using DataGridComboboxColom
<DataGridComboBoxColumn Width="100" x:Name="cmbProduct" SelectedValueBinding="{Binding Code, Mode=TwoWay}" DisplayMemberPath="{Binding Code}"></DataGridComboBoxColumn>
</DataGrid.Columns>
(ii)By using DataTemplate
<DataGridTemplateColumn Header="ProductCode">
<DataGridTemplateColumn.CellTemplate>
<DataTemplate>
<TextBlock Text="{Binding Code}" />
</DataTemplate>
</DataGridTemplateColumn.CellTemplate>
<DataGridTemplateColumn.CellEditingTemplate>
<DataTemplate>
<ComboBox ItemsSource="{Binding Codes}"></ComboBox>
</DataTemplate>
</DataGridTemplateColumn.CellEditingTemplate>
</DataGridTemplateColumn>

WPF Custom datagrid column header

I need to create a Custom dataGrid DataGridTextColumn like the sketch below:
The Red rectangles are TextBox and are used to search within the column.
so far i have implemented a datagrid like this (simplify Version):
<DataGrid x:Name="CompassLogDataGrid"
Grid.Row="1"
Style="{DynamicResource ResourceKey=DataGridStyle}"
IsTextSearchEnabled="True">
<DataGrid.Columns>
<DataGridTextColumn CellStyle="{StaticResource IdCell}"
x:Name="ID"
Header="ID"
Foreground="Black"
Binding="{Binding ID}"
DisplayIndex="0" />
<DataGridTextColumn x:Name="DateGTC"
Header="Date"
Binding="{Binding DateString}"
CellStyle="{StaticResource DateGTCCell}" />
</DataGrid.Columns
</DataGrid
I have no idea how to create those textBoxes. Any clue would be appreciate it
DataGridTemplateColumn is what you are looking for. You can customize the template as per your need -
<DataGrid>
<DataGrid.Columns>
<DataGridTemplateColumn>
<DataGridTemplateColumn.CellTemplate>
<DataTemplate>
<TextBox BorderBrush="Red" BorderThickness="3" Margin="5"/>
</DataTemplate>
</DataGridTemplateColumn.CellTemplate>
</DataGridTemplateColumn>
</DataGrid.Columns>
</DataGrid>
With sample ItemsSource it gives this look -
EDIT
In case you want to customize the header, you need to provide HeaderTemplate for your column like this -
<DataGrid>
<DataGrid.Columns>
<DataGridTextColumn Binding="{Binding Name}"
Header="{Binding HeaderName}">
<DataGridTextColumn.HeaderTemplate>
<DataTemplate>
<StackPanel>
<TextBlock Text="{Binding Content, RelativeSource=
{RelativeSource Mode=TemplatedParent}}"
Margin="5"/>
<TextBox BorderBrush="Red" BorderThickness="3"
Width="50" Margin="5"/>
</StackPanel>
</DataTemplate>
</DataGridTextColumn.HeaderTemplate>
</DataGridTextColumn>
</DataGrid.Columns>
</DataGrid>
Here's the look -

Categories

Resources