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

How to Add a Column in silverlight grid having image buttons

3 Answers 92 Views
GridView
This is a migrated thread and some comments may be shown as answers.
Vineet Dhingra
Top achievements
Rank 1
Vineet Dhingra asked on 25 Sep 2009, 08:33 AM
Hi,
Actually i am designing a grid which would have a edit and a delete column. Can anyone tell me how to add these column which would be having a image button and how to get it's button click event. actually i have found how to add a normal button but it does not have attribute to make it an image button.

3 Answers, 1 is accepted

Sort by
0
Pavel Pavlov
Telerik team
answered on 25 Sep 2009, 01:12 PM
Hi Vineet Dhingra,

To convert the button to  an image button just set the  button's content property to an image element.
Something like :

<Button   Click="buttonTest_Click">  
         <StackPanel Orientation="Vertical">  
            <Image Source="image1.jpg" /> 
            <TextBlock Text="Test 1" /> 
         </StackPanel> 
</Button> 

Let me know if  you have further troubles implementing this into RadGridView

Kind regards,
Pavel Pavlov
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
0
Chhavi Nath
Top achievements
Rank 1
answered on 17 Jan 2012, 10:50 AM
Hi Pavel,

 Can you please describe how to do the same using MVVM approach?
 I have tried it using MVVM approach but when i click on the image button, it does not call the method associated with the command property.
 

<

 

 

telerik:RadGridView Grid.Row="1" Margin="0" x:Name="SearchCustomerGrid" ItemsSource="{Binding CustomerSearchResultList}"

 

 

 

SelectedItem="{Binding CustomerSelectedInGrid, Mode=TwoWay}" IsReadOnly="False"

 

 

 

RowIndicatorVisibility="Collapsed" ShowGroupFooters="False" ShowGroupPanel="False"

 

 

 

AutoGenerateColumns="False" SelectionMode="Single"

 

 

 

VerticalAlignment="Stretch" Width="Auto" HorizontalAlignment="Stretch" Height="Auto">

 

 

 

 

<telerik:RadGridView.Columns>

 

 

 

 

 

     <telerik:GridViewDataColumn>

 

 

 

 

         <telerik:GridViewDataColumn.CellTemplate>

 

 

 

 

            <DataTemplate>

 

 

 

 

                   <Button  Width="20"Height="21" Command="{Binding  ElementName=LayoutRoot,Path=DataContext.UnBlockCommand}" HorizontalAlignment="Center">

 

 

 

 

                        <Image Source="{Binding Image,Mode=OneWay}" />

 

 

 

 

 

 

 

                    </Button>

 

 

 

 

            </DataTemplate>

 

 

 

 

         </telerik:GridViewDataColumn.CellTemplate>

 

 

 

 

     </telerik:GridViewDataColumn>

 

 

 

 

 

</telerik:RadGridView.Columns>

 

 

 

 

</telerik:RadGridView>

Following line of code is written in the constructor of the ViewModel.

 

        UnBlockCommand =

 

new DelegateCommand(UnBlockCustomer);

Thanks
Chhavi

 

0
Pavel Pavlov
Telerik team
answered on 17 Jan 2012, 05:15 PM
Hi,

Using ElementName binding inside the cells is not recommended.  Please try the following .
Expose your model as a static resource and for the command binding use a static resource instead element name.

This should do the trick.

Kind regards,
Pavel Pavlov
the Telerik team

Explore the entire Telerik portfolio by downloading the Ultimate Collection trial package. Get it now >>

Tags
GridView
Asked by
Vineet Dhingra
Top achievements
Rank 1
Answers by
Pavel Pavlov
Telerik team
Chhavi Nath
Top achievements
Rank 1
Share this question
or