This is a migrated thread and some comments may be shown as answers.

How to fill RadGridView's cell with RadCombobox

4 Answers 377 Views

GridView

This is a migrated thread and some comments may be shown as answers.

This question is locked. New answers and comments are not allowed.

Maciej asked on 28 Nov 2014, 02:53 PM

comboboxproblem.png

Hi Telerik's support.

I'm trying to build my cell template in RadGridView with RadComboBox. I would like to fill cell with combobox, but regardless setting gridview's cell padding to 0 and combobox's VerticalAligment to Stretch it still have got 24px height with margins on the top and the bottom. What should I do to obtain this effect.

Here is the code and screenschots:

<base:ModalWindowBase.Resources>

<Style x:Name="BookkeepingAccountsCellStyle" TargetType="telerik:GridViewCell">

<Setter Property="Padding" Value="0"/>

</Style>

</base:ModalWindowBase.Resources>

<controls:RadGridView x:Name="BookkeepingSchemaModificationObjectsGridView"

ItemsSource="{Binding Path=FilteredBookkeepingSchemaModificationObjects}"

IsFilteringAllowed="true"

IsReadOnly="False"

EditTriggers="CellClick">

<controls:RadGridView.Columns>

<telerik:GridViewDataColumn DataMemberBinding="{Binding BookkeepingSchemaSalaryComponentDefinitionSummary.ComponentNumber}" Width="Auto" IsReadOnly="True"/>

<telerik:GridViewDataColumn DataMemberBinding="{Binding BookkeepingSchemaSalaryComponentDefinitionSummary.ComponentName}" Width="*" MinWidth="150" TextWrapping="Wrap" IsReadOnly="True"/>

<telerik:GridViewDataColumn Header="{Binding Source={StaticResource TermsProvider}, Path=Captions.DebitBookkeepingAccount}"

Width="Auto"

MinWidth="200"

TextAlignment="Center"

IsReadOnly="False"

CellStyle="{StaticResource BookkeepingAccountsCellStyle}"

DataMemberBinding="{Binding DebitBookkeepingAccountId, Mode=TwoWay, NotifyOnValidationError=True}">

<telerik:GridViewDataColumn.CellTemplate>

<DataTemplate DataType="models:BookkeepingSchemaModificationObject">

<Grid>

<Grid.ColumnDefinitions>

<ColumnDefinition Width="Auto"/>

<ColumnDefinition Width="15"/>

<ColumnDefinition Width="Auto"/>

</Grid.ColumnDefinitions>

<TextBlock Grid.Column="0" Text="{Binding Path=DebitBookkeepingAccountNumber}" Margin="4,4,0,4"/>

<TextBlock Grid.Column="1" Text="-" HorizontalAlignment="Center" Margin="0,4"/>

<TextBlock Grid.Column="2" Text="{Binding Path=DebitBookkeepingAccountName}" TextWrapping="Wrap" Margin="0,4,4,4"/>

</Grid>

</DataTemplate>

</telerik:GridViewDataColumn.CellTemplate>

<telerik:GridViewDataColumn.CellEditTemplate>

<DataTemplate DataType="models:BookkeepingSchemaModificationObject">

<telerik:RadComboBox EmptyText="{Binding Source={StaticResource TermsProvider},Path=Messages.None}"

ItemsSource="{Binding Path=BookkeepingAccounts}"

SelectedValuePath="Guid"

VerticalAlignment="Stretch"

Margin="0"

SelectedValue="{Binding Path=DebitBookkeepingAccountId, Mode=TwoWay, NotifyOnValidationError=True}">

<telerik:RadComboBox.ItemTemplate>

<DataTemplate>

<Grid>

<Grid.ColumnDefinitions>

<ColumnDefinition Width="Auto"/>

<ColumnDefinition Width="15"/>

<ColumnDefinition Width="Auto"/>

</Grid.ColumnDefinitions>

<TextBlock Grid.Column="0" Text="{Binding Path=AccountNumber}" Margin="0,4"/>

<TextBlock Grid.Column="1" Text="-" HorizontalAlignment="Center" Margin="0,4"/>

<TextBlock Grid.Column="2" Text="{Binding Path=AccountName}" TextWrapping="Wrap" MaxWidth="360" Margin="0,4"/>

</Grid>

</DataTemplate>

</telerik:RadComboBox.ItemTemplate>

</telerik:RadComboBox>

</DataTemplate>

</telerik:GridViewDataColumn.CellEditTemplate>

</telerik:GridViewDataColumn>

</controls:RadGridView.Columns>

</controls:RadGridView>

4 Answers, 1 is accepted

answered on 02 Dec 2014, 12:05 PM

Hello Maciej,

In general when you put a RadComboBox as a CellEditTemplate of a column it will size with the row height. However, if you set the Height property of the RadComboBox you will observe the behavior from your image. So in order to resolve this, you will need to look in your project for a style or a property targeting the RadComboBox, which can modify or affect the height of the control.

I hope this helps.

Regards,
Boris
Telerik

Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.