Hierarchical Grid with plus/minus node image

3 posts, 0 answers
  1. ajmal
    ajmal avatar
    57 posts
    Member since:
    Oct 2006

    Posted 13 Jul 2010 Link to this post

    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.
  2. Princy
    Princy avatar
    17421 posts
    Member since:
    Mar 2007

    Posted 13 Jul 2010 Link to this post

    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.

  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. David Gilden
    David Gilden avatar
    1 posts
    Member since:
    Dec 2006

    Posted 27 Jul 2010 Link to this post

    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
Back to Top