SlidingPane title request

9 posts, 0 answers
  1. Nancy Cara
    Nancy Cara avatar
    17 posts
    Member since:
    Feb 2008

    Posted 06 Mar 2008 Link to this post

    I would like to display 'Contacts' on the sliding pane when collapsed but display a longer title at the top when expanded 'Contacts for John Smith'. The reason is I need to identify who the contacts are for but I don't want the long title along the side of my splitter when it's collapsed. It would be nice to see ExpandedTitle and CollapsedTitle properties.
  2. Yavor
    Admin
    Yavor avatar
    11 posts

    Posted 10 Mar 2008 Link to this post

    Hello Nancy,

    Can you please elaborate a little bit more on the functionality that you are seeking to achieve?
    I assume that you are using the Slider pager functionality. In this scenario, where would you like to display the titles, and how would you like to collapse the control?

    Sincerely yours,
    Yavor
    the Telerik team

    Instantly find answers to your questions at the new Telerik Support Center
  3. Nancy Cara
    Nancy Cara avatar
    17 posts
    Member since:
    Feb 2008

    Posted 10 Mar 2008 Link to this post

    Hello Yavor,

    I must apologize. I posted the question in the wrong forum. I had thought I posted in the Splitter control forum. I am referring to the slidingpane of the RadSplitter (Prometheus). I would like the Title property to actually be two different properties - ExpandedTitle and CollapsedTitle so that I can do something like this.... When collapsed the slidingpane title shows 'Contacts' but when expanded the slidingpane title shows 'Contacts for John Smith' at the top. It seems that currently both places share the Title property.

    Nancy
  4. Ubong
    Admin
    Ubong avatar
    328 posts

    Posted 11 Mar 2008 Link to this post


    Hello Nancy,

    You can easily do this with the provided ClientSide API as demonstrated below:
    You will see that the title of 'Pane1' changes on expand and returns back to 'Contacts' when another pane is selected.

       
     <script type="text/javascript">  
        function SetTitletoJohn()  
        {  
        var splttr = $find('<%=RadSplitter1.ClientID %>');  
        var pane = splttr.getPaneById(mypane);  
        var mypane  = $find('<%=SlidingZone1.ClientID %>').GetPaneById('Pane1');  
        var secndpane = $find('<%=SlidingZone1.ClientID %>').GetPaneById('Pane2');  
        var thirdpane = $find('<%=SlidingZone1.ClientID %>').GetPaneById('Pane3');  
          
        if (!mypane)return ;  
        if (mypane)   
              {  
                  mypane.set_title('Contacts for John Smith');  
              }   
                          
             else  
              {  
                mypane.set_title('Contacts');  
                          
              }  
                      
          
        }  
          
        function SetTitleBack()  
            {  
                 var mypane  = $find('<%=SlidingZone1.ClientID %>').GetPaneById('Pane1');  
             if (!mypane)return ;  
             if (mypane)   
               {  
          
                 mypane.set_title('Contacts');  
          
                }  
             }  
          
           
          
           </script> 
         <asp:ScriptManager ID="ScriptManager1" runat="server">  
            </asp:ScriptManager> 
      <telerik:RadSplitter id="RadSplitter1" runat="server" height="400" width="700">  
                    <telerik:RadPane id="LeftPane" runat="server" width="22" scrolling="none">  
                        <telerik:RadSlidingZone id="SlidingZone1" runat="server" width="22">  
                            <telerik:RadSlidingPane id="Pane1" Title="Contacts" OnClientCollapsed="SetTitleBack" OnClientExpanded="SetTitletoJohn" runat="server" width="150">Pane1</telerik:RadSlidingPane> 
                            <telerik:RadSlidingPane id="Pane2" title="Pane2" runat="server" width="150">Pane2</telerik:RadSlidingPane> 
                            <telerik:RadSlidingPane id="Pane3" title="Pane3" runat="server" width="150">Pane3</telerik:RadSlidingPane> 
                        </telerik:RadSlidingZone> 
                    </telerik:RadPane> 
                    <telerik:RadSplitBar id="RadSplitbar1" runat="server"></telerik:RadSplitBar> 
                    <telerik:RadPane id="MiddlePane" runat="server">Main Pane</telerik:RadPane> 
                    
                      
                </telerik:RadSplitter> 

    Inject the code and enjoy!

    You should also have a look at the online examples for more details here: http://www.telerik.com/demos/aspnet/prometheus/Splitter/Examples/ClientSideAPI/DefaultCS.aspx

    Best Regards,
    Ubong
    the Telerik team

    Instantly find answers to your questions at the new Telerik Support Center
  5. Nancy Cara
    Nancy Cara avatar
    17 posts
    Member since:
    Feb 2008

    Posted 13 Mar 2008 Link to this post

    Thank-you. I was able to get it to work with this:

    function

    SetTitleForName(sender, eventArgs)

    {

    var slidingZone = $find("<%= RadSlidingZone1.ClientID %>");

    var slidingPane = slidingZone.getPaneById('RadSlidingPane1');

    var l = document.getElementById(label);

    var title = ('Contacts for ' + l.innerHTML);

    slidingPane.set_Title(title);

    }

    However I was reading the documentation for the Prometheus Sliding Pane members and events and it says that eventArgs contains the pane being passed in as paneObj and you can use eventArgs.paneObj.ID to retrieve the pane ID that is calling the function. I could not get this to work as I get an error that paneObj.ID is null or not an object. It would be convenient for me to know which sliding pane is calling the function as I have several panes calling it and they all set the same title property.

  6. Tsvetie
    Admin
    Tsvetie avatar
    1517 posts

    Posted 17 Mar 2008 Link to this post

    Hello Nancy Cara,
    I believe you are looking at the help for RadSplitter Classic. To review the online documentation for RadSplitter Prometheus, please follow this link. In order to get the ClientID of the pane, calling the function, you can use the sender.get_id() method, as the sender is the pane client object.

    Best wishes,
    Tsvetie
    the Telerik team

    Instantly find answers to your questions at the new Telerik Support Center
  7. Nancy Cara
    Nancy Cara avatar
    17 posts
    Member since:
    Feb 2008

    Posted 17 Mar 2008 Link to this post

    Thank-you - that works.

    I got my link to the previous statement on PaneObj here: http://www.telerik.com/help/radcontrols/prometheus/Telerik.Web.UI~Telerik.Web.UI.SplitterPaneBase~OnClientBeforeExpand.html  It indicates prometheus in the URL so I assumed it applied to prometheus. And prometheus uses Telerik.Web.UI

    Where can I find the documentation on sender.get_id()

  8. Svetlina Anati
    Admin
    Svetlina Anati avatar
    2795 posts

    Posted 19 Mar 2008 Link to this post

    Hi Nancy Cara,

    The "Prometheus" controls are based upon MS AJAX Framework and as any other ajax objects you can get and set their properties using the get_property() and set_property() methods. These methods are not specific methods for our controls, this is the way you can manipulate every ajax object's properties. This being said, if you have a reference to the RadSplitter control, for example, you can get/set all its properties in this manner:

     var splitter = $find("<%= RadSplitter1.ClientID %>");  
           alert(splitter.get_id());  
           alert(splitter.get_width());  
           alert(splitter.get_height());  
           //etc 

    The sender object is the object which raises the event in the eventhandler - in different context it is a different object - if you execute a pane's eventhandler, the pane would be the sender object.
    This being said there is no specific documentation on this in our online resources because it is not part of the controls' specific client-side API.

    Regards,
    Svetlina
    the Telerik team

    Instantly find answers to your questions at the new Telerik Support Center
  9. Nancy Cara
    Nancy Cara avatar
    17 posts
    Member since:
    Feb 2008

    Posted 19 Mar 2008 Link to this post

    Thank-you Svetlina - that is great information to know!

    Nancy
Back to Top