Remove contentpane width on change resolution case

2 posts, 0 answers
  1. Jignesh
    Jignesh avatar
    44 posts
    Member since:
    Jan 2007

    Posted 09 Jul 2010 Link to this post

    Hello Friends,

     I need to remove width of particular radpane when resolution in not 1024*768. means when resolution is 1024*768 than i need contentpane width is : 1089px otherwise i want to remove width property of contentPane.
    my aspx page code is.

     <telerik:RadSplitter ID="RadSplitter1" runat="server" Height="560" Width="100%" OnClientLoaded="setclasswidth"  >
                <telerik:RadPane ID="navigationPane" runat="server" Width="163">
                    <div>
                        This is header
                    </div>
                </telerik:RadPane>
                <telerik:RadSplitBar ID="RadSplitbar1" runat="server" CollapseMode="Forward" />
                <telerik:RadPane ID="contentPane" Scrolling="None" runat="server"  Width="1089px">
                    <div>
                        This is content
                    </div>
            </telerik:RadPane>
    </telerik:RadSplitter>

    i made one function setclasswidth and call it on OnClientLoaded event.
    my javascript function is,

    function setclasswidth(sender, Args)
    {
        if ((screen.width==1024) && (screen.height==768))
       {
         alert('something');
       }
       else
       {
              var splitter = sender;
              var endPane = splitter.getPaneById("contentPane");   
              alert(endPane.get_width());
       }
      }

    by using alert(endPane.get_width()); i get the contentPane width but how i will remove width on that case.

    Pls help me.

    Thanks & Regards
    Jignesh Patel
  2. Dobromir
    Admin
    Dobromir avatar
    1633 posts

    Posted 14 Jul 2010 Link to this post

    Hi Jignesh,

    This functionality is not supported by RadSplitter out-of-the-box, and cannot be achieved using the client-side API of the RadPane. For this specific scenario you can use one of the following approaches to achieve the required output:
    1. Invoke AJAX call inside the OnClientLoaded event handler. Then during this AJAX call remove the Width of the pane, e.g.:
      function setclasswidth(sender, Args)
      {
          var ajaxManager = $find("RadAjaxManager1");
          if ((screen.width == 1024) && (screen.height == 768))
          {
              ajaxManager.ajaxRequest("lowres"); //invoke AJAX request
          }
          else
          {
             ......
          }
      }
      protected void Page_Load(object sender, EventArgs e)
      {
          RadAjaxManager1.AjaxRequest += new Telerik.Web.UI.RadAjaxControl.AjaxRequestDelegate(RadAjaxManager1_AjaxRequest);
      }
       
      void RadAjaxManager1_AjaxRequest(object sender, Telerik.Web.UI.AjaxRequestEventArgs e)
      {
          if (e.Argument == "lowres")
          {
              RadSplitter1.GetPaneById("contentPane").Width = Unit.Empty;//remove the with of the pane
          }
      }
    2. Register the pane as 'free size pane' and set its MinWidth property to the required width,e.g.:
      <telerik:RadPane ID="contentPane" Scrolling="None" runat="server" MinWidth="1089">
      </telerik:RadPane>

    I hope this helps.

    All the best,
    Dobromir
    the Telerik team
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
  3. UI for ASP.NET Ajax is Ready for VS 2017
Back to Top