RadButton Commanding Support?

[RoadWarrior]

What is the RadButton's support for commanding?  From my experimentation, setting the Command property of the the RadButton doesn't work as expected.  My ICommand.Execute method was never invoked.  If this does work, could you please provide a working example.  Thanks.

[Ivan]

Hi Rick Kennedy,

Thank you for contacting us.

Please preview the "Buttons and Commands" example. There is another implementation of this example related to the WPF. However if you are still experiencing difficulties please send us your project and we will try to fix or workaround it.

Kind regards,
Ivan
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.

[RoadWarrior]

Thanks for pointer to the example.  I will make use of this, but the question still remains of when/if Telerik will move to support the upcoming Silverlight Commanding framework now that it will be available in SL4 and beyond.  The value of this for me and your customers is that it will allow for better integration of Telerik's controls with non-Telerik controls. Consider that non-Telerik controls will not be implementing the Telerik.Windows.RoutedEvent but will most likely implement the System.Windows.Input.ICommand interface.  This will allow us to create Command objects to be invoked by RadControls as well as non-RadControls.

[David Stanfield]

I was able to bind to a SL4 ICommand to a RadButton in the following manner:

 

<

 

 

Controls:RadButton Command="{Binding TestCommand}" Content="Click me"/>

 

Then in my view model class (or you could do it in your code-behind):

 

 

private ICommand _testCommand;

 

 

 

public ICommand TestCommand

 

{

 

 

get { return _testCommand ?? (_testCommand = new TestCommand(this)); }

 

}

 

 

public void OnTest()

 

{

 

 

MessageBox.Show("Test command executed");

 

}

And then the command class:

 

 

public class TestCommand : ICommand

 

{

 

 

private readonly TestViewModel _viewModel;

 

 

 

public TestCommand(TestViewModel viewModel)

 

{

_viewModel = viewModel;

}

 

 

public bool CanExecute(object parameter)

 

{

 

 

return true;

 

}

 

 

public event EventHandler CanExecuteChanged;

 

 

 

public void Execute(object parameter)

 

{

_viewModel.OnTest();

}

}

 

Since I am using a view model class, I have this in the code-behind of my UserControl:

 

 

 

public Test()

 

{

InitializeComponent();

DataContext =

 

new TestViewModel();

 

}

 

 

When I click the button, I get the MessageBox, as expected.

David

[RoadWarrior]

Exactly what I needed.  Thanks for the quick response.

[David Stanfield]

Glad to hear it!

By the way, the approach I showed used a separate class that implemented the ICommand interface (TestCommand). You'd probably be better off either using the DelegateCommand class in the Silverlight.FX framework, the one in the Prism framework, or simply including your own DelegateCommand class in you project, as John Papa did in this recent post:

http://johnpapa.net/silverlight/5-simple-steps-to-commanding-in-silverlight/?utm_source=feedburner&utm_medium=feed&utm_campaign=Feed%3A+JohnPapaSilverlight+%28JohnPapa.net+Silverlight%29

You can then simply create a new DelegateCommand, which takes two parameters, a pointer to a method that determines whether or not it CanExcecute, and a pointer to a method that determines what should be done when it executes. John's code does it like this:

LoadProductsCommand = new DelegateCommand(LoadProducts, CanLoadProducts);

This is just a cleaner way of doing it. If you end up with 20 commands or more, it's best not to have a separate class for each of them.

Ross

[Kowal]

Hi,

I've got major problem with RadButtons and Commands.
I've modified part of the project that uses John Papa's solution and can be found below:

http://openlightgroup.net/Blog/tabid/58/EntryId/82/Blend-4-TreeView-SelectedItemChanged-using-MVVM.aspx

I've added following code to MainPage.xaml (between "BEGIN/END MOD")

<TextBlock Text="{Binding ViewModelProperty}" HorizontalAlignment="Left" VerticalAlignment="Top" Canvas.Left="68" Canvas.Top="61" Width="102" Height="27"/>

<!-- BEGIN MOD -->
        <StackPanel Orientation="Horizontal">
            <Button Content="Button" Command="{Binding ModProductsCommand}"
                CommandParameter="{Binding SelectedItem, ElementName=treeView, Mode=TwoWay}"/>
            <telerik:RadButton Content="Telerik" Command="{Binding ModProductsCommand}"
                CommandParameter="{Binding SelectedItem, ElementName=treeView, Mode=TwoWay}"/>
        </StackPanel>
<!-- END MOD -->

<sdk:TreeView x:Name="treeView" ...

Modified MainViewModel.cs (constructor modified between "BEGIN/END MOD", added ModProductsCommand, and ModProducts/CanModProducts)

        public MainViewModel() 
        { 
            // Set the command property 
            SetProductsCommand = new DelegateCommand(SetProducts, CanSetProducts); 
 
            /* BEGIN MOD */ 
            ModProductsCommand = new DelegateCommand(ModProducts, CanModProducts); 
            /* END MOD */ 
 
            // Set Sample Tree Data 
            SilverlightFolders = DataGenerator.SilverlightFolders(); 
        } 
 
        public ICommand ModProductsCommand { get; set; } 
 
        public void ModProducts(object param) 
        { 
            return; 
        } 
 
        private bool CanModProducts(object param) 
        { 
            return param != null; 
        } 

Now, after the application loads, sdk and tererik buttons are disabled (that's OK). After I choose any of the tree elements, applications throws StackOverflowException. If I remove RadButton from xaml, sdk button works OK, that is, it is enabled then tree element are selected.
I've got similar example then I use RadGridView. This time RadButton doesn't hang the application, it 'only' never enables itself when grid rows are selected (sdk button behaves as expected).
I have to add, and you check it for yourself, that CanModProduct is properly called and it has right arguments (null at first, tree/grid element afterwards).

Regards,
Kowal

[Miro Miroslavov]

Hello Kowal,

There are two problems in this example.
The first one is binding two buttons (no matter sdk or teleriks') to the same DelegateCommand and having at least one of them with bound CommandParameter, causes StackOverFlow exception. Which obviously is problem in the DelegateCommand.
And the second problem is a bug in the RadButton - which doesn't respond correctly to changes in the CommandParameter. (Which causes the problem with the Grid i guess.) I've created work item for this and should be fixed for the next internal build.
Thank you for reporting it.

Kind regards,
Miro Miroslavov
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.

[Allen]

I cannot get the RadButton command to fire, even though Snoop says I hav eclicked on its content.  The binding appears correct.  The button is enabled.

Here is the button XAML:
   <telerik:RadButtonGroup x:Name="radRulesNavigatorButtonGroup"
                                        Height="40" FontWeight="Bold" VerticalAlignment="Top" HorizontalAlignment="Stretch"
                                        HorizontalContentAlignment="Center"
                                        VerticalContentAlignment="Center"
                                        BorderThickness="2,2,2,2"
                                        Width="Auto"  
                                        Grid.Row="1">
...
...
...
Other buttons
...
...
...
                    <telerik:RadButton x:Name="radButtonParseAndValidate" ToolTip="Parse and validate the selected rules"
                                       Command="{Binding ValidateRulesCommand}"
                                       VerticalAlignment="Center" VerticalContentAlignment="Center">
                        <telerik:RadButton.ContentTemplate>
                            <DataTemplate>
                                <DockPanel>
                                    <TextBlock Text="Validate" DockPanel.Dock="Left"
                                       TextAlignment="Center"
                                       FontWeight="Bold"
                                       VerticalAlignment="Center" HorizontalAlignment="Center"/>
                                    <Separator Width="4" Visibility="Hidden" />
                                    <Image DockPanel.Dock="Right" Height="Auto" Width="Auto" Source="pack://application:,,,/ResourceLibrary;component/Resources/Images/Menu/CheckMark.png" />
                                </DockPanel>
                            </DataTemplate>
                        </telerik:RadButton.ContentTemplate>
                    </telerik:RadButton>
...
...
Other RadButton objects
...
...
</telerik:RadButton>

As you can see this button has an image and textbox on it inside a dockpanel, per other examples from Telerik.  Looks lovely, but does nothing.  Snoop reports that the button is bound to the correct command on the correct viewmodel, which is a RelayCommand  (GalaSoft MVVMLight Toolkit).  It shows that the mouse has clicked the TextBox or the Image but the command on the encloinbg button never fires.  There must be some sort of templating issue here... but I cannot divine the problem,

This is really puzzling.  Another button just like this does in fact fire and exit the application.

This button is within a RadButtonGroup.


Thanks.

[Petar Mladenov]

Hello Allen,

I prepared a sample that uses most of your code and I was unable to reproduce your issue - the command executes fine. Could you please check out my test project and correct me if I am doing something wrong or I have missed something ? Thank you for your cooperation.

Best wishes,
Petar Mladenov
the Telerik team