1

Is it possible to make the whole text area of the RadComboBox clickable while having IsEditable=true and ReadOnly=True?

I would just set IsEditable = false but unfortunately I need it to be editable in order to display custom text when something is selected (I have it set so multiple things can be selected and present a list of the selected items). If I disable IsEditable then I lose the .Text attribute and can't set a custom text.

My two best bets would be:
1) somehow apply a style that makes the whole textbar clickable and not just the arrow
2) somehow apply custom text display when IsEditable is set to false.

Unfortunately I don't know how to do either so any help would be nice. Thanks

Edit: This would be ideal, except that we're using Silverlight and not ASP.net http://demos.telerik.com/aspnet-ajax/combobox/examples/functionality/checkboxes/defaultcs.aspx

This is probably more realistic, just to somehow make the text area clickable so it opens the dropdown menu. Just like the ComboBox on the right, minus being able to type.
http://demos.telerik.com/aspnet-ajax/combobox/examples/functionality/comboboxvsdropdownlist/defaultcs.aspx

Max
  • 105
  • 7

2 Answers2

0

I can think of several solutions, of varying elegance. Here is one that might be suitable to close your remaining gap between the Arrow-ToggleButton and the Text-Input-Area. And now that I think about it... maybe you can get rid of that rather smelly and fragile side-effect-piggybacking with the OpenDropDownOnFocus property (which will break as soon as a click does not change the focus owner).

Register a MouseLeftButtonDown click handler with the RadComboBox, you can choose to get all events, not only unhandled events. Then we can toggle the DropDown from there. But we don't want to interfere with the Arrow-ToggleButton, therefore we check from where the mouse click originated.

public class MyView : UserControl
{
    public MyView()
    {
        InitializeComponent();
        MouseButtonEventHandler handler = OnComboBoxClicked;
        radComboBox.AddHandler( UIElement.MouseLeftButtonDownEvent, handler,
            handledEventsToo: true );
    }

    private void OnComboBoxClicked( object sender, MouseButtonEventArgs args )
    {
        if (!args.Handled ||
            !args.IsRoutedEventFromToggleButton(
                togglebuttonAncestorToStopTheSearch: (UIElement) sender))
        {
            ToggleDropDown();
        }
    }
}

and extension methods for easier use:

public static class ControlExtensions
{
    public static bool IsRoutedEventFromToggleButton(
        this RoutedEventArgs args,
        UIElement togglebuttonAncestorToStopTheSearch )
    {
        ToggleButton toggleButton = ((UIElement) args.OriginalSource)
            .GetAncestor<ToggleButton>( togglebuttonAncestorToStopTheSearch );
        return toggleButton != null;
    }

    public static TAncestor GetAncestor<TAncestor>(
        this DependencyObject subElement,
        UIElement potentialAncestorToStopTheSearch )
        where TAncestor : DependencyObject
    {
        DependencyObject parent;
        for (DependencyObject subControl = subElement; subControl != null;
             subControl = parent)
        {
            if (subControl is TAncestor) return (TAncestor) subControl;

            if (object.ReferenceEquals( subControl,
                potentialAncestorToStopTheSearch )) return null;


            parent = VisualTreeHelper.GetParent( subControl );
            if (parent == null)
            {
                FrameworkElement element = subControl as FrameworkElement;
                if (element != null)
                {
                    parent = element.Parent;
                }
            }
        }
        return null;
    }
}
Martin
  • 5,714
  • 2
  • 21
  • 41
  • I implemented this, but it still didn't allow the area between the text and the drop down arrow to be clickable in a combobox that has IsEditable enabled. Thanks though. I found a complete solution which I'll post here shortly – Max Oct 10 '14 at 23:33
0

I ended up finding a multiselectcombobox that someone else implemented here:

http://www.telerik.com/support/code-library/a-multiselect-combobox

I didn't need the whole combobox itself since we already had one implemented so I just looked at how the person was displaying a custom message while the combo box IsEditable was set to false.

After looking at that code for a while and seeing how I can make it work for me, I put

<ucControls:RadComboBox.SelectionBoxTemplate> <DataTemplate> <TextBlock Text="{Binding Text,ElementName=RadCombo}" /> </DataTemplate> </ucControls:RadComboBox.SelectionBoxTemplate>

inside the XAML of our own custom MultiSelectComboBox. (RadCombo being the name of the particular control that I wanted the Text to be linked to)

<ucControls:RadComboBox
    x:Name="RadCombo"
    Text=""
    ........

<ucControls:RadComboBox.SelectionBoxTemplate> <DataTemplate> <TextBlock Text="{Binding Text,ElementName=RadCombo}" /> </DataTemplate> </ucControls:RadComboBox.SelectionBoxTemplate>

    .......
</ucControls:RadComboBox>

Using the built in SelectionBoxTemplate, this basically just added a TextBlock overlay, and the content was bound to the RadComboBox's own Text, so when we would set the Text of the RadComboBox, the TextBlock would update itself.

This was the most effective way for us to do it because it required minimal code changes, and no structure changes since we already had all the code in place for checking boxes and setting a custom text.

Hope this helps someone, best of luck!

Max
  • 105
  • 7