WPF: Binding to DataGrid - wpf

Well, I have couple of problem with DataGrid in WPF.
I have a Progress Bar in DataGrid which I want to show value from Database [Well complete DataGrid is bound to Datatable which I fetch from Database].
I have a Status as Enum in my code, and it's numeric value is store in database, though it is databind properly, I want to show Enum "string" rather than numeric value.
I didn't find if I rowDataBound which we use in ASP.NET, using that I can do this, but not sure how to do it now in WPF.
<DataGrid Height="125" Grid.Row="1" AutoGenerateColumns="False" HorizontalAlignment="Stretch" Name="grdData" VerticalAlignment="Stretch" ItemsSource="{Binding}" IsReadOnly="True"
GridLinesVisibility="Horizontal" HorizontalGridLinesBrush="#FFBEBEBE" VerticalGridLinesBrush="#FFBEBEBE" RowHeight="25" BorderThickness="0"
FontWeight="Bold" Background="{DynamicResource {x:Static SystemColors.ControlLightBrushKey}}" AlternatingRowBackground="DarkGray"
Foreground="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}" RowBackground="White" ColumnHeaderHeight="25" VerticalScrollBarVisibility="Visible"
BorderBrush="{DynamicResource {x:Static SystemColors.ActiveBorderBrushKey}}">
<DataGrid.Columns>
<DataGridTextColumn Header="Task Name" MinWidth="30" Width="100" Binding="{Binding Path=TaskName}" />
<DataGridTextColumn Header="Code" MinWidth="30" Width="50" Binding="{Binding Path=TaskCode}" />
<DataGridTextColumn Header="Status" Width="50" Binding="{Binding Path=Status}"/>
<DataGridTemplateColumn Header="Completed?" Width="*" >
<DataGridTemplateColumn.CellTemplate >
<DataTemplate>
<ProgressBar x:Name="TaskProgress" HorizontalAlignment="Stretch" Value="{Binding Path=CompletePercentage}" />
</DataTemplate>
</DataGridTemplateColumn.CellTemplate>
</DataGridTemplateColumn>
</DataGrid.Columns>
</DataGrid>
than in my C# code I put
grdData.DataContext = dt
Where dt is my Datatable filled using database simple select query.
Thanks.

Related

Unable to see vertical scroll bar in datagrid when placed inside grid in WPF

From last 2 day I am stuck in a small problem which I don't know why I was not able to solve it. I had did lots off goggling and implemented various suggestion provided by stack overflow to solve out the problem but finally I am getting tired off by unsuccessful implementation.
My problem is that I want a scroll able data grid which could be placed inside a Grid control or DockPanel(As I had tried with both). Below is code which I am using.
<Grid IsEnabled="{Binding IsCalcVarGridPartEnable}">
<Grid.Resources>
<BooleanToVisibilityConverter x:Key="boolToVisiblityConverter" />
<sys.converters:BoolToVisibleHiddenConvertor x:Key="boolToVisibleHiddenConvertor"/>
<FrameworkElement x:Key="ProxyElement"
DataContext="{Binding}"/>
</Grid.Resources>
<Grid.RowDefinitions>
<RowDefinition Height="30" />
<RowDefinition Height="*" />
<RowDefinition Height="30"/>
</Grid.RowDefinitions>
<Border Style="{StaticResource SeperatorStyle}" Grid.Row="0">
<TextBlock Style="{StaticResource BannerTextStyle}" Text="Calculation Variable" />
</Border>
<Border Style="{StaticResource SeperatorStyle}" Grid.Row="2">
<Button Content="Edit" HorizontalAlignment="Right" Margin="10,5" Command="{Binding EditCalcVarCmd}" />
</Border>
<ContentControl Visibility="Collapsed"
Content="{StaticResource ProxyElement}"/>
<DataGrid AutoGenerateColumns="False"
Name="dataGridCalcVar"
VerticalAlignment="Top"
HorizontalAlignment="Left"
IsReadOnly="True"
SelectionMode="Single"
SelectionUnit="FullRow"
ItemsSource="{Binding CalcVarCollection}"
SelectedItem="{Binding SelectedCalcVar}"
HorizontalScrollBarVisibility="Auto"
VerticalScrollBarVisibility="Auto"
>
<i:Interaction.Triggers>
<i:EventTrigger EventName="MouseDoubleClick" >
<i:InvokeCommandAction Command="{Binding CalcVarDoubleClickedCmd}" />
</i:EventTrigger>
</i:Interaction.Triggers>
<DataGrid.ColumnHeaderStyle>
<StaticResourceExtension ResourceKey="DataGridColumnHeaderStyle" />
</DataGrid.ColumnHeaderStyle>
<DataGrid.CellStyle>
<StaticResourceExtension ResourceKey="DataGridCellStyle" />
</DataGrid.CellStyle>
<DataGrid.Columns>
<DataGridTextColumn Header="Type Description" MinWidth="150" MaxWidth="200" Binding="{Binding CalcTypName}" />
<DataGridTextColumn Header="Variable Description" MinWidth="150" MaxWidth="200" Binding="{Binding CalcVarName}" />
<DataGridTextColumn Header="Major Description" MinWidth="150" MaxWidth="200" Binding="{Binding MjAcctTypDesc}"
Visibility="{Binding DataContext.IsMjMiAcctTypVisible, Source={StaticResource ProxyElement},
Converter={StaticResource boolToVisibleHiddenConvertor}}" />
<DataGridTextColumn Header="Minor Description" MinWidth="150" MaxWidth="200" Binding="{Binding MiAcctTypDesc}"
Visibility="{Binding DataContext.IsMjMiAcctTypVisible, Source={StaticResource ProxyElement},
Converter={StaticResource boolToVisibleHiddenConvertor}}" />
<DataGridTextColumn Header="DNA Value" MinWidth="50" MaxWidth="200" Binding="{Binding CalcVarValueName}" />
<DataGridTextColumn Header="Critical Value" MinWidth="50" MaxWidth="200" Binding="{Binding CriticalValueName}" />
<DataGridTextColumn Header="Note" MinWidth="150" MaxWidth="200" Binding="{Binding Note}" />
</DataGrid.Columns>
</DataGrid>
<sysclient:PartStatusView Grid.RowSpan="5" Grid.ColumnSpan="7"
Style="{DynamicResource PartStatusViewDefaultStyle}" IsTabStop="False"/>
</Grid>
Important: I am able to get scroll bar only when I set max height of Datagrid control but I don't want to set max-height property of either row or datagrid control. I want that when I resize window or whatever space is available datagrid is set into that space and when we query the data then if data data is greater than available space then data grid brings vertical scroll bar.
Please help me!!!!!
I hope I am able to explain my problem. :-) :-)
Thanks,
From what I can see there are two attributes which can help you here
add Grid.Row="1" to your data grid
remove VerticalAlignment="Top" from the same which actually prevent it to take height from the container
eg
<DataGrid AutoGenerateColumns="False"
Name="dataGridCalcVar"
Grid.Row="1"
HorizontalAlignment="Left"
IsReadOnly="True"
SelectionMode="Single"
SelectionUnit="FullRow"
ItemsSource="{Binding CalcVarCollection}"
SelectedItem="{Binding SelectedCalcVar}"
HorizontalScrollBarVisibility="Auto"
VerticalScrollBarVisibility="Auto">
I am assuming that you want to place grid in the middle row which takes up the remaining space.

need to select or highlight alike rows in datagrid with RowDetailsTemplate--mvvm

I have datagrid that have rowdetails. My rows can be duplicated. I want to select all rows that are alike. how can I achieve that. I'm using mvvm pattern. I bind the selectedItem to the same property in my view model, but it does not work.
Here's the xaml code:
<DataGrid Margin="0,6,0,12"
BorderBrush="Silver"
SelectionMode="Single"
HeadersVisibility="Column"
AutoGenerateColumns="False"
CanUserAddRows="False"
CanUserDeleteRows="False"
CanUserSortColumns="False"
CanUserReorderColumns="False"
VerticalGridLinesBrush="Silver"
HorizontalGridLinesBrush="Silver"
VerticalScrollBarVisibility="Visible"
HorizontalScrollBarVisibility="Auto"
RowDetailsVisibilityMode="Visible"
IsSynchronizedWithCurrentItem="{x:Null}"
ItemsSource="{Binding AccessoryWalls}"
Grid.Row="1"
Grid.Column="0"
Name="gAccessories">
<DataGrid.Columns>
<DataGridTextColumn Binding="{Binding ID,StringFormat='W{0}'}" FontWeight="Bold" Foreground="Blue" />
</DataGrid.Columns>
<DataGrid.RowDetailsTemplate >
<DataTemplate>
<Grid >
<DataGrid ItemsSource="{Binding Accessories}"
SelectedItem="{Binding Path=DataContext.SelectedAccessory, RelativeSource={RelativeSource AncestorType={x:Type UserControl}},Mode=TwoWay}"
CanUserAddRows="False"
HeadersVisibility="Column"
AutoGenerateColumns="False">
<DataGrid.Columns>
<DataGridTextColumn Header="Horizontal"
Width="60"
Binding="{Binding Horizontal, Converter={StaticResource DimensionConverter}}" />
<DataGridTextColumn Header="Vertical"
Width="60"
Binding="{Binding Vertical, Converter={StaticResource DimensionConverter}}" />
<DataGridTextColumn Header="Detail"
IsReadOnly="True"
Binding="{Binding LongName}" />
</DataGrid.Columns>
<DataGrid.RowDetailsTemplate>
<DataTemplate />
</DataGrid.RowDetailsTemplate>
</DataGrid>
</Grid>
</DataTemplate>
</DataGrid.RowDetailsTemplate>
</DataGrid>
As you see I bind it to "SelectedAccessory" on VM level and it works. It synchronizes with other controls in the screen, but it does not synchronizes with other rows in the datagrid.
I would like to select all "Overhead Door Opening12" rows when I clicked on one of them.
Thanks in advance.

Datagrid Column Header Templating

I want to template some headercolumns in a pretty simple way, but I don't get the results I am looking for. I want the Border to fill the whole header, not just the textbox inside. Right now I am still having the default gray behind my own controls.
<DataGrid x:Name="grdItems"
Grid.Row="0"
CanUserAddRows="False"
CanUserDeleteRows="False"
ItemsSource="{Binding Path=Items}"
CanUserSortColumns="False" AutoGenerateColumns="False" CanUserResizeColumns="False">
<DataGrid.Columns>
<DataGridComboBoxColumn ItemsSource="{Binding Source={StaticResource GetSignalTypeValues}}" Width="auto" SelectedValueBinding="{Binding SignalType}" >
<DataGridComboBoxColumn.HeaderTemplate>
<DataTemplate>
<Border Background="Orange" >
<TextBlock Text="Signal Type" />
</Border>
</DataTemplate>
</DataGridComboBoxColumn.HeaderTemplate>
</DataGridComboBoxColumn>
<DataGridTextColumn Width="auto" Binding="{Binding AmplitudeMax}">
<DataGridTextColumn.HeaderTemplate>
<DataTemplate>
<Border Background="Violet">
<StackPanel>
<TextBlock Text="Amplitude" HorizontalAlignment="Center" />
<TextBlock Text="-maximum-" HorizontalAlignment="Center" />
</StackPanel>
</Border>
</DataTemplate>
</DataGridTextColumn.HeaderTemplate>
</DataGridTextColumn>
If you are only after background color of column header you can utilize this:
<DataGridComboBoxColumn Width="auto" SelectedValueBinding="{Binding SignalType}" >
<DataGridComboBoxColumn.HeaderStyle>
<Style TargetType="DataGridColumnHeader">
<Setter Property="Background" Value="Orange"/>
</Style>
</DataGridComboBoxColumn.HeaderStyle>

WPF Toolkit Datagrid Copying Grid

I'm using the datagrid from the WPF Toolkit for 3.5.
I have a need to TextWrap one of my columns in this grid so have embedded a TextBlock in this column.
The issue I have now is that when I copy the grids content into excel (Ctrl A, Ctrl C) this column is blank.
Any help on resolving this would be much appreciated. Below is my XAML for the grid.
<tk:DataGrid Name="dgDataGrid" Margin="3" AutoGenerateColumns="False" HeadersVisibility="All"
ClipboardCopyMode="IncludeHeader" SnapsToDevicePixels="True"
CanUserAddRows="False" CanUserDeleteRows="False" IsReadOnly="True"
SelectionMode="Extended" SelectionUnit="Cell">
<tk:DataGrid.Columns>
<tk:DataGridTextColumn Binding="{Binding ID}" Header="Message ID" Visibility="Hidden" FontWeight="Black" />
<tk:DataGridTextColumn Binding="{Binding UserInitials}" Header="User" Width="Auto" />
<tk:DataGridTextColumn Binding="{Binding EntryDate}" Header="Time Stamp" Width="Auto" />
<tk:DataGridTemplateColumn Header="Message" Width="*">
<tk:DataGridTemplateColumn.CellTemplate>
<DataTemplate>
<TextBlock Margin="0" Text="{Binding Message}" TextWrapping="Wrap"/>
</DataTemplate>
</tk:DataGridTemplateColumn.CellTemplate>
</tk:DataGridTemplateColumn>
</tk:DataGrid.Columns>
</tk:DataGrid>
Set the ClipboardContentBinding property on the DataGridTemplateColumn.

Binding with Relativesource --wpf

I have a short question:
I have a datagrid and binded it to something. Then I put a combobox in a column and binded it to another source by
ItemsSource="{Binding DataContext.Users, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type DataGrid}}}"
Now I want to use datagrid's source again, in the combobox again.That code doesn't work now and I know that there is a ID column in datagrid's source.
SelectedValue="{Binding ID}"
How can I fix it? Thanks in advance.
And here is my whole DataGrid and the problematic part is the combobox.
<DataGrid ItemsSource="{Binding SCs}" SelectedItem="{Binding SelectedSC}" Margin="0,10,0,0"
RowStyle="{StaticResource ResourceKey=DataGridRowStyle}" Style="{DynamicResource ResourceKey=UILDataGridStyle}" AutoGenerateColumns="False" EnableRowVirtualization="True"
RowDetailsVisibilityMode="VisibleWhenSelected" Width="Auto" IsReadOnly="True" Background="Transparent"
VerticalAlignment="Stretch" HorizontalAlignment="Stretch" GridLinesVisibility="Vertical" VerticalGridLinesBrush="{DynamicResource ResourceKey=UILBorderBrush}"
RowHeaderWidth="0" HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Auto" BorderBrush="{DynamicResource ResourceKey=UILBorderBrush}"
BorderThickness="1" SelectionUnit="FullRow" SelectionMode="Single" x:Name="SCDataGrid">
<DataGrid.Columns>
<DataGridTextColumn x:Name="securityConfigurationIDColumn" Binding="{Binding Path=SecurityConfigurationID}" Header="Security Configuration ID" Width="*" />
<DataGridTextColumn x:Name="securityConfigurationNameColumn" Binding="{Binding Path=SecurityConfigurationName}" Header="Security Configuration Name" Width="*" />
<DataGridTemplateColumn x:Name="proxyResponsibleUser_IDColumn" Header="Proxy Responsible User ID" Width="*" >
<DataGridTemplateColumn.CellTemplate>
<DataTemplate>
<ComboBox IsEnabled="True" ItemsSource="{Binding DataContext.Users, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type DataGrid}}}"
SelectedValuePath="{Binding UserID}" DisplayMemberPath="{Binding FullName}" Width="117" Height="20"
SelectedValue="{Binding ProxyResponsibleUser_ID, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type ComboBox}}, UpdateSourceTrigger=PropertyChanged, Mode=TwoWay}" />
</DataTemplate>
</DataGridTemplateColumn.CellTemplate>
</DataGridTemplateColumn>
<DataGridTextColumn x:Name="responsibleUser_IDColumn" Binding="{Binding Path=User.FullName}" Header="Responsible User ID" Width="*" />
<DataGridTextColumn x:Name="securityConfigurationDescriptionColumn" Binding="{Binding Path=SecurityConfigurationDescription}" Header="Security Configuration Description" Width="*" />
<DataGridTextColumn x:Name="securityConfigurationURLColumn" Binding="{Binding Path=SecurityConfigurationURL}" Header="Security Configuration URL" Width="*" />
</DataGrid.Columns>
</DataGrid>
Use below cell template for combo box.
This code binds entire grid datasource to combo box template, which allow you use any property without doing the jugglery of finding ancestors..
<DataGridTemplateColumn.CellTemplate>
<DataTemplate>
<Grid DataContext="{Binding }">
<ComboBox IsEnabled="True"
ItemsSource="{Binding Users}"
SelectedValuePath="{Binding UserID}"
DisplayMemberPath="{Binding FullName}"
Width="117" Height="20"
SelectedValue="{Binding ProxyResponsibleUser_ID,
UpdateSourceTrigger=PropertyChanged, Mode=TwoWay}"/>
</Grid>
</DataTemplate>
</DataGridTemplateColumn.CellTemplate>

Resources