Hierarchical Grid with plus/minus node image

[ajmal]

Hello,

Please look at my grid snapshot, I need to implement plus/minus sign in case of hierarchicahl display. where should I need to put image in telerik grid and the way..please help.

[Princy]

Hello Ajmal,

You can use the following CSS style settings to change the Expand and Collapse images.

CSS:

<style type="text/css">
  .rgExpand
  {
    background-image: url('../Images/Expand.gif') !important; /* set url of Expand image */
    background-position:0px !important;
  }
  .rgCollapse
  {
    background-image: url('../Images/Collapse.gif') !important;/* set url of Collapse image */
    background-position:0px !important;
  }
  </style>

Or try the following code snippet in ColumnCreated event.

C#:

protected void RadGrid1_ColumnCreated(object sender, GridColumnCreatedEventArgs e)
   {
       if (e.Column is GridExpandColumn)
       {
           (e.Column as GridExpandColumn).ButtonType = GridExpandColumnType.ImageButton;
           (e.Column as GridExpandColumn).ExpandImageUrl = "../Images/Expand.gif"; //set Expand image url
           (e.Column as GridExpandColumn).CollapseImageUrl = "../Images/Collapse.gif";//set Collapse image url
       }
   }

Hope this helps,
Princy.

[David Gilden]

Put this In the markup, easy :)

 

<Columns>

 

 

<telerik:GridExpandColumn

 

 

UniqueName="showMsgs"

 

 

CommandName="showAppMessages"

 

 

ExpandImageUrl="~/images/icons/singlePlus.gif"

 

 

CollapseImageUrl="~/images/icons/singleMinus.gif"

 

 

ButtonType="ImageButton">

 

 

<ItemStyle Width="20px" />

 

 

</telerik:GridExpandColumn>

 

 .. etc..

 

</Columns>

 

Regards,

David Gilden MCSD