[Solved] Editing Combox in gridview

[smith]

HI

i am using rad gridview  i want when ever mouse hover the second column need to show the drop down menu .


2. if i click the particular column need to enter value instead of select  need to achive two functionality

how ot do  i am new to telerik pls send the examples ,

[smith]

hi

any body got the solution

[Hristo Deshev]

Hello smith,

I think the best approach is to encapsulate the needed behavior in a control that you can then place in the respective column's GridViewCell controls. I did that with a user control that I called HoverComboBox. Here is how it gets created (note the GridViewCell style that sets a new template):

<telerikGrid:RadGridView Name="RadGridView1" AutoGenerateColumns="false">
    <telerikGrid:RadGridView.Resources>
        <Style x:Key="HoverComboCellStyle" TargetType="GridView:GridViewCell">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="GridView:GridViewCell">
                        <ComboBoxHoverOpen:HoverComboBox SelectedFolderId="{Binding FolderID}">
                        </ComboBoxHoverOpen:HoverComboBox>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </telerikGrid:RadGridView.Resources>
    <telerikGrid:RadGridView.Columns>
        <telerikGrid:GridViewDataColumn HeaderText="Folder" UniqueName="FolderID" CellStyle="{StaticResource HoverComboCellStyle}"></telerikGrid:GridViewDataColumn>
        <telerikGrid:GridViewDataColumn UniqueName="Subject"></telerikGrid:GridViewDataColumn>
    </telerikGrid:RadGridView.Columns>
</telerikGrid:RadGridView>

We are binding the combos to a collection of FolderType objects, each having an ID and a Name property. We pass the SelectedFolderId with a binding that takes the current Message object FolderID value.

Now on to the control itself. It has to define a SelectedFolderId dependency property:

// Using a DependencyProperty as the backing store for SelectedFolderId.  This enables animation, styling, binding, etc...
public static readonly DependencyProperty SelectedFolderIdProperty =
    DependencyProperty.Register("SelectedFolderId", typeof(int), typeof(HoverComboBox), new PropertyMetadata(0, SelectedFolderIdChanged));

private HoverComboViewModel ViewModel;

private static void SelectedFolderIdChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
{
    var target = (HoverComboBox) d;
    target.ViewModel.SelectedFolderId = (int) e.NewValue;
}

It also uses the Model-View-ViewModel pattern and defines a ViewModel: HoverComboViewModel. It contains the FolderType objects and the selected folder ID. The user control XAML contains a single RadComboBox instance:

<UserControl x:Class="ComboBoxHoverOpen.HoverComboBox"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:Controls="clr-namespace:Telerik.Windows.Controls;assembly=Telerik.Windows.Controls.Input">
    <Controls:RadComboBox Name="HoverCombo"
            ItemsSource="{Binding FolderTypes}"
            DisplayMemberPath="Name"
            SelectedValuePath="ID"
            IsEditable="true"
            SelectedValue="{Binding SelectedFolderId}">
    </Controls:RadComboBox>
</UserControl>

What's left is to implement your requirements. First we need an IsMouseOver property, and we implement it by overriding the OnMouseEnter and OnMouseLeave methods:

protected override void OnMouseEnter(MouseEventArgs e)
{
    base.OnMouseEnter(e);
    this.IsMouseOver = true;
}

protected override void OnMouseLeave(MouseEventArgs e)
{
    base.OnMouseLeave(e);
    this.IsMouseOver = false;
}

In the IsMouseOver property change callback we open or close the combo drop down:

private static void OnIsMouseOverChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
{
    var target = (HoverComboBox) d;
    target.HoverCombo.IsDropDownOpen = target.IsMouseOver;
}

Finally, when the user clicks the combo, we get a focus event. We need to override OnGotFocus and close the combo dropdown to fullfil the second requirement:

protected override void OnGotFocus(RoutedEventArgs e)
{
    base.OnGotFocus(e);

    this.HoverCombo.IsDropDownOpen = false;
}

That's all. I am attaching a sample project for your reference.

All the best,
Hristo Deshev
the Telerik team

Check out Telerik Trainer , the state of the art learning tool for Telerik products.