expand / collapse arrow

7 posts, 0 answers
  1. Todd A
    Todd A avatar
    43 posts
    Member since:
    Sep 2009

    Posted 06 Dec 2010 Link to this post

    I am using a RadPanelBar -- I am currently hiding the expand and collapse arrows using the following code:

    .rpExpandHandle
    {
        display: none!important;
    }
     .rpCollapseHandle
    {
        display: none!important;
    }


    This works great -- except now I need to add another RadPanelBar to the same page where I need to show the expand and collapse arrows.

    I read in the following help file that if you set the imageUrl and imagePosition to right, then it will replace the image.  Unfortunately I can't get that to work.

    Here's the help link:

    http://www.telerik.com/help/aspnet-ajax/panel_appearanceitemimages.html

    Here's my code sample:

    <telerik:RadPanelBar runat="server" ID="SupportPanelBar" Width="150" >
                            <ExpandAnimation Type="None"></ExpandAnimation>
                            <CollapseAnimation Type="None"></CollapseAnimation>
                            <Items>                         
                                <telerik:RadPanelItem Text="TeamSideline" Expanded="True" PreventCollapse="true" NavigateUrl="/Home.aspx" ImagePosition="Right" ImageUrl="~/img/icon_delete_active.png" SelectedImageUrl="~/img/icon_delete_active.png">
                                    <Items>
                                        <telerik:RadPanelItem Text="Support Menu" NavigateUrl="/Support/Home.aspx" BackColor="#D7D8D8"  />                                    
                                        <telerik:RadPanelItem Text="Public Downloads" NavigateUrl="/TsMoreInfo.aspx" BackColor="#D7D8D8" />                                                                        
                                    </Items>
                                </telerik:RadPanelItem>                                                                                
                            </Items>
                        </telerik:RadPanelBar>

    And the output is attached.  I am using the telerik dll -- 2010.3.1109.40

    Your help is appreciated.

    Thanks,
    Todd.




  2. Shinu
    Shinu avatar
    17764 posts
    Member since:
    Mar 2007

    Posted 07 Dec 2010 Link to this post

    Hello Todd,


    Then you can follow another technique to hide the expand/collapse image by using javascript code. Attach OnClientLoad client event and iterate through all the items to hide the image.

    Code for reference:
    <script type="text/javascript">
        function OnClientLoad(sender, args) {
            var items = sender.get_allItems();
            for (var i = 0; i < items.length; i++) {
                items[i].get_expandHandleElement().style.display = "none";
            }
        }
    </script>



    -Shinu.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Todd A
    Todd A avatar
    43 posts
    Member since:
    Sep 2009

    Posted 07 Dec 2010 Link to this post

    Hi Shinu,

    Thank you for the workaround.

    If I could do what the documentation says -- that would be ideal.

    Is this a bug?

    Thanks,
    Todd.
  5. Shinu
    Shinu avatar
    17764 posts
    Member since:
    Mar 2007

    Posted 08 Dec 2010 Link to this post

    Hello,


    The behavior is expected since you applied the CSS rule for global CSS selector. It will be applied for all the RadPanelBars on page and hence it is not a bug.

    So, the javascript will be useful for customizing any specific RadPanelBar by accessing the particular item and setting CSS rule for that. Hope I explained it better. :)


    -Shinu.
  6. Todd A
    Todd A avatar
    43 posts
    Member since:
    Sep 2009

    Posted 08 Dec 2010 Link to this post

    Hi Shinu,

    I appreciate your responses.

    I have removed the global CSS code.  And then the up and down arrows showed as expected.

    I applied the code per the documentation, setting the imageUrl and positioning it to the right, and the arrows did not disappear as expected.

    Thanks
    Todd.
  7. Todd A
    Todd A avatar
    43 posts
    Member since:
    Sep 2009

    Posted 13 Dec 2010 Link to this post

    I tried this solution - and it works although when the page renders, the handles are briefly shown.

    Regarding the documentation and not working like it's documented, should I submit a support ticket?

    Thanks,
    Todd.
  8. Yana
    Admin
    Yana avatar
    4554 posts

    Posted 21 Dec 2010 Link to this post

    Hello Todd,

    You are right that the documentation is not correct, we'll review and update the article. Thanks for reporting this, I've updated your points.

    Kind regards,
    Yana
    the Telerik team
    Browse the vast support resources we have to jumpstart your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017