resizing multipage problem after ajaxmanager's ajaxRequest

6 posts, 0 answers
  1. shunman
    shunman avatar
    77 posts
    Member since:
    Jul 2011

    Posted 01 Nov 2011 Link to this post

    Hi Telerik Team.

    i'm using radstrip and multipage control for switching screen.
    and main page has 2 usercontrols.

    i difined mainpage splitter resize event that adjust each usercontrol's splitter width and height.

    WebUserControl1 has a button

    the button call javascript function and raise ajaxmanager request event.


    - load first menu
    -.load second menu
    -.resizing web browser from any tabs, it works fine.

    but i have a problem, below phase
    - load first menu
    - load second menu
    -click the button in the WebUserControl1
    - resizing web browser while focusing WebUserControl1
    -switch other tabs --> It tab's screen width and height are broken.

    how can i make same width and height from other tab's screen?

    please let me know good solution. thank you.
    i'm attaching source code. i'm sorry , i don't know how to upload zip file.

    Default.aspx
    <%@ Page Language="VB" AutoEventWireup="false" CodeBehind="Default.aspx.vb" Inherits="damnitsplitter._Default" %>
     
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <head runat="server">
        <title></title>
        <style type="text/css">
            html, body, form
            {
                width: 100%;
                height: 100%;
                margin: 0px;
                padding: 0px;
                overflow: hidden;
            }
        </style>
        <script type="text/javascript">
            function OnClientResized(sender, args) {
                var panewidth = $find("DefaultContents").get_width();
                var paneheight = $find("DefaultContents").get_height();
     
                var firstmenusplitter = $find($("#UserControl1Splitter").val());
                firstmenusplitter.resize(panewidth, paneheight);
                firstmenusplitter.repaint();
     
                var secondmenusplitter = $find($("#UserControl2Splitter").val());
                secondmenusplitter.resize(panewidth, paneheight);
                secondmenusplitter.repaint();
            }
     
            function OnClientTabSelected(sender, args) {
                var panewidth = $find("DefaultContents").get_width();
                var paneheight = $find("DefaultContents").get_height();
     
                var firstmenusplitter = $find($("#UserControl1Splitter").val());
                firstmenusplitter.resize(panewidth, paneheight);
                firstmenusplitter.repaint();
     
                var secondmenusplitter = $find($("#UserControl2Splitter").val());
                secondmenusplitter.resize(panewidth, paneheight);
                secondmenusplitter.repaint();
            }
     
            function OnClientTabSelecting(sender, args) {
     
            }
            function OnRequestStart() {
                var pageLoadWindow = $find("RadWindowPageLoad");
                pageLoadWindow.show();
            }
     
            function OnResponseEnd() {
                var pageLoadWindow = $find("RadWindowPageLoad");
                pageLoadWindow.close();
            }
     
            function sendingdata() {
                var radAjaxManager = $find("RadAjaxManager1");
                radAjaxManager.ajaxRequest("damn it RadSplitter!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!");
            }
     
        </script>
    </head>
    <body>
        <form id="form1" runat="server">
        <div style="display: none;">
            <telerik:RadScriptManager ID="RadScriptManager1" runat="server">
                <scripts>
                    <%--Needed for JavaScript IntelliSense in VS2010--%>
                    <%--For VS2008 replace RadScriptManager with ScriptManager--%>
                    <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.Core.js" />
                    <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQuery.js" />
                    <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQueryInclude.js" />
                </scripts>
            </telerik:RadScriptManager>
            <telerik:RadWindow ID="RadWindowPageLoad" AutoSize="false" Skin="Simple" Modal="true"
                Overlay="true" VisibleTitlebar="true" Title="Processing..." Behaviors="None"
                VisibleStatusbar="false" Width="400" Height="200" runat="server" Style="position: absolute;
                z-index: 9000;">
                <contenttemplate>
                    <div style="margin-top: 55px; text-align: center; vertical-align: middle;">
                        <asp:Image ID="ImagePageLoading" runat="server" />
                    </div>
                </contenttemplate>
            </telerik:RadWindow>
        </div>
        <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
            <clientevents onrequeststart="OnRequestStart" onresponseend="OnResponseEnd" />
            <ajaxsettings>
                    <telerik:AjaxSetting AjaxControlID="DefaultRadMenu">
                        <UpdatedControls>
                            <telerik:AjaxUpdatedControl ControlID="DefaultRadSplitter1" UpdatePanelHeight="100%" />
                            <telerik:AjaxUpdatedControl ControlID="hiddenfields" />
                        </UpdatedControls>
                    </telerik:AjaxSetting>
                    <telerik:AjaxSetting AjaxControlID="RadAjaxManager1">
                        <UpdatedControls>
                            <telerik:AjaxUpdatedControl ControlID="DefaultRadSplitter1" UpdatePanelHeight="100%"/>
                            <telerik:AjaxUpdatedControl ControlID="hiddenfields" />
                        </UpdatedControls>
                    </telerik:AjaxSetting>
                </ajaxsettings>
        </telerik:RadAjaxManager>
        <telerik:RadSplitter runat="server" ID="DefaultRadSplitter1" Orientation="Horizontal"
            OnClientResized="OnClientResized" Width="100%" Height="100%">
            <telerik:RadPane runat="server" ID="DefaultHeader" Height="60" CssClass="DefaultHeaderCss"
                Scrolling="None">
                <div style="height: 100%; width: 100%; background-color: Gray;">
                    <telerik:RadMenu ID="DefaultRadMenu" runat="server" EnableShadows="true">
                        <items>
                            <telerik:RadMenuItem Text="first menu" Value="first menu" PostBack="false">
                                <Items>
                                    <telerik:RadMenuItem Text="first menu1" Value="WebUserControl1" />
                                </Items>
                            </telerik:RadMenuItem>
                            <telerik:RadMenuItem IsSeparator="true" />
                            <telerik:RadMenuItem Text="second menu" Value="second menu" PostBack="false">
                                <Items>
                                    <telerik:RadMenuItem Text="second menu1" Value="WebUserControl2" />
                                </Items>
                            </telerik:RadMenuItem>
                        </items>
                    </telerik:RadMenu>
                </div>
            </telerik:RadPane>
            <telerik:RadPane runat="server" ID="DefaultTab" Height="30">
                <telerik:RadTabStrip runat="server" ID="DefaultRadTabStrip" MultiPageID="DefaultMultiPage"
                    OnClientTabSelected="OnClientTabSelected" OnClientTabSelecting="OnClientTabSelecting">
                    <tabtemplate>
                        <asp:Label ID="LabelTabName" runat="server" Text='<%# DataBinder.Eval(Container, "Text") %>' />
                        <span class="ie6shim"></span>
                    </tabtemplate>
                </telerik:RadTabStrip>
            </telerik:RadPane>
            <telerik:RadPane runat="server" ID="DefaultContents" Width="100%" Height="100%" Scrolling="None">
                <telerik:RadMultiPage runat="server" ID="DefaultMultiPage">
                </telerik:RadMultiPage>
            </telerik:RadPane>
            <telerik:RadPane runat="server" ID="DefaultFooter" Height="30">
                <div style="height: 100%; width: 100%; background-color: Gray">
                    Footer</div>
            </telerik:RadPane>
        </telerik:RadSplitter>
        <asp:Panel runat="server" ID="hiddenfields">
            <asp:HiddenField runat="server" ID="UserControl1Splitter" />
            <asp:HiddenField runat="server" ID="UserControl2Splitter" />
        </asp:Panel>
        </form>
    </body>
    </html>


    Default.aspx.vb
    Imports Telerik.Web.UI
     
    Partial Class _Default
        Inherits System.Web.UI.Page
        Private Sub RadMenuTopItemClick(sender As Object, e As Telerik.Web.UI.RadMenuEventArgs) Handles DefaultRadMenu.ItemClick
     
            Try
     
                If DefaultRadTabStrip.FindTabByText(e.Item.Text) Is Nothing Then
                    AddTab(e.Item.Text)
                    DefaultRadTabStrip.FindTabByText(e.Item.Text).Value = e.Item.Value
                    AddPageView(DefaultRadTabStrip.FindTabByText(e.Item.Text))
                    DefaultRadTabStrip.DataBind()
     
                Else
                    DefaultRadTabStrip.FindTabByText(e.Item.Text).Selected = True
                    DefaultRadTabStrip.FindTabByText(e.Item.Text).PageView.Selected = True
     
                End If
     
            Catch ex As Exception
                Throw ex
            End Try
     
        End Sub
     
        Private Sub AddTab(ByVal tabName As String)
            VisibleRadTabContent(True)
            DefaultTab.Collapsed = False
     
            If DefaultRadTabStrip.SelectedTab IsNot Nothing Then
                DefaultRadTabStrip.SelectedTab.Selected = False
            End If
     
            Dim tab As RadTab = New RadTab
            tab.Text = tabName
            tab.Selected = True
            DefaultRadTabStrip.Tabs.Add(tab)
     
        End Sub
     
        Private Sub AddPageView(ByVal tab As RadTab)
            Dim pageView As RadPageView = New RadPageView
            pageView.ID = tab.Value
            pageView.Selected = True
            pageView.Width = System.Web.UI.WebControls.Unit.Percentage(100)
            pageView.Height = System.Web.UI.WebControls.Unit.Percentage(100)
            DefaultMultiPage.PageViews.Add(pageView)
            tab.PageViewID = pageView.ID
        End Sub
     
     
        Private Sub VisibleRadTabContent(value As Boolean)
            DefaultRadTabStrip.Visible = value
            DefaultRadTabStrip.Visible = value
        End Sub
     
        Protected Sub DefaultMultiPage_PageViewCreated(sender As Object, e As Telerik.Web.UI.RadMultiPageEventArgs) Handles DefaultMultiPage.PageViewCreated
            Dim userControlName As String = e.PageView.ID + ".ascx"
            Dim userControl As Control = Page.LoadControl(userControlName)
            userControl.ID = e.PageView.ID & "_userControl"
            e.PageView.Controls.Add(userControl)
        End Sub
     
        Protected Sub RadAjaxManager_AjaxRequest(ByVal sender As Object, ByVal e As Telerik.Web.UI.AjaxRequestEventArgs) Handles RadAjaxManager1.AjaxRequest
            Dim a = e.Argument
        End Sub
    End Class


    WebUserControl1.ascx
    <%@ Control Language="vb" AutoEventWireup="false" CodeBehind="WebUserControl1.ascx.vb"
        Inherits="damnitsplitter.WebUserControl1" %>
     
     
    <telerik:RadSplitter runat="server" ID="WebUserControl1RadSplitterWrap" Orientation="Horizontal"
        Width="100%" Height="100%">
        <telerik:RadPane runat="server" ID="WebUserControl1RadPaneMenu" height="30">
            <div>
                <asp:Button ID="sendtodefaultpage" runat="server" Text="Button" OnClientClick="return sendingdata();"/>
            </div>
        </telerik:RadPane>
        <telerik:RadPane runat="server" ID="WebUserControl1RadPane" Width="100%" Height="100%"
            Scrolling="Y">
            <div style="background-color: yellow">
                start<br />
                WebUserControl 1 Content<br />
                WebUserControl 1 Content<br />
                WebUserControl 1 Content<br />
                WebUserControl 1 Content<br />
                WebUserControl 1 Content<br />
                WebUserControl 1 Content<br />
                WebUserControl 1 Content<br />
                WebUserControl 1 Content<br />
                WebUserControl 1 Content<br />
                WebUserControl 1 Content<br />
                WebUserControl 1 Content<br />
                WebUserControl 1 Content<br />
                WebUserControl 1 Content<br />
                WebUserControl 1 Content<br />
                WebUserControl 1 Content<br />
                WebUserControl 1 Content<br />
                WebUserControl 1 Content<br />
                WebUserControl 1 Content<br />
                WebUserControl 1 Content<br />
                WebUserControl 1 Content<br />
                WebUserControl 1 Content<br />
                WebUserControl 1 Content<br />
                WebUserControl 1 Content<br />
                WebUserControl 1 Content<br />
                WebUserControl 1 Content<br />
                WebUserControl 1 Content<br />
                WebUserControl 1 Content<br />
                WebUserControl 1 Content<br />
                WebUserControl 1 Content<br />
                WebUserControl 1 Content<br />
                WebUserControl 1 Content<br />
                WebUserControl 1 Content<br />
                WebUserControl 1 Content<br />
                WebUserControl 1 Content<br />
                WebUserControl 1 Content<br />
                WebUserControl 1 Content<br />
                WebUserControl 1 Content<br />
                WebUserControl 1 Content<br />
                WebUserControl 1 Content<br />
                WebUserControl 1 Content<br />
                WebUserControl 1 Content<br />
                WebUserControl 1 Content<br />
                WebUserControl 1 Content<br />
                WebUserControl 1 Content<br />
                WebUserControl 1 Content<br />
                WebUserControl 1 Content<br />
                WebUserControl 1 Content<br />
                WebUserControl 1 Content<br />
                WebUserControl 1 Content<br />
                WebUserControl 1 Content<br />
                WebUserControl 1 Content<br />
                WebUserControl 1 Content<br />
                WebUserControl 1 Content<br />
                WebUserControl 1 Content<br />
                end<br />
            </div>
        </telerik:RadPane>
    </telerik:RadSplitter>


    WebUserControl1.ascx.vb
    Public Class WebUserControl1
        Inherits System.Web.UI.UserControl
     
        Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
            Dim hiddenfield = DirectCast(Page.FindControl("UserControl1Splitter"), HiddenField)
            hiddenfield.Value = WebUserControl1RadSplitterWrap.ClientID
        End Sub
     
    End Class


    WebUserControl2.ascx
    <%@ Control Language="vb" AutoEventWireup="false" CodeBehind="WebUserControl2.ascx.vb"
        Inherits="damnitsplitter.WebUserControl2" %>
    <telerik:RadSplitter runat="server" ID="WebUserControl1RadSplitterWrap" Orientation="Horizontal"
        Width="100%" Height="100%">
        <telerik:RadPane runat="server" ID="WebUserControl1RadPane" Scrolling="None">
            <telerik:RadSplitter runat="server" ID="RadSplitter" Orientation="Vertical" Width="100%"
                ResizeWithParentPane="false" Height="100%">
                <telerik:RadPane runat="server" ID="RadPane1" Scrolling="None">
                    <div style="background-color: Blue;">
                        WebUserControl 2 Content fisrt
                    </div>
                </telerik:RadPane>
                <telerik:RadSplitBar runat="server">
                </telerik:RadSplitBar>
                <telerik:RadPane runat="server" ID="RadPane2" Scrolling="Y">
                    <div style="background-color: yellow">
                        start<br />
                        WebUserControl 2 Content<br />
                        WebUserControl 2 Content<br />
                        WebUserControl 2 Content<br />
                        WebUserControl 2 Content<br />
                        WebUserControl 2 Content<br />
                        WebUserControl 2 Content<br />
                        WebUserControl 2 Content<br />
                        WebUserControl 2 Content<br />
                        WebUserControl 2 Content<br />
                        WebUserControl 2 Content<br />
                        WebUserControl 2 Content<br />
                        WebUserControl 2 Content<br />
                        WebUserControl 2 Content<br />
                        WebUserControl 2 Content<br />
                        WebUserControl 2 Content<br />
                        WebUserControl 2 Content<br />
                        WebUserControl 2 Content<br />
                        WebUserControl 2 Content<br />
                        WebUserControl 2 Content<br />
                        WebUserControl 2 Content<br />
                        WebUserControl 2 Content<br />
                        WebUserControl 2 Content<br />
                        WebUserControl 2 Content<br />
                        WebUserControl 2 Content<br />
                        WebUserControl 2 Content<br />
                        WebUserControl 2 Content<br />
                        WebUserControl 2 Content<br />
                        WebUserControl 2 Content<br />
                        WebUserControl 2 Content<br />
                        WebUserControl 2 Content<br />
                        WebUserControl 2 Content<br />
                        WebUserControl 2 Content<br />
                        WebUserControl 2 Content<br />
                        WebUserControl 2 Content<br />
                        WebUserControl 2 Content<br />
                        WebUserControl 2 Content<br />
                        WebUserControl 2 Content<br />
                        WebUserControl 2 Content<br />
                        WebUserControl 2 Content<br />
                        WebUserControl 2 Content<br />
                        WebUserControl 2 Content<br />
                        WebUserControl 2 Content<br />
                        WebUserControl 2 Content<br />
                        WebUserControl 2 Content<br />
                        WebUserControl 2 Content<br />
                        WebUserControl 2 Content<br />
                        WebUserControl 2 Content<br />
                        WebUserControl 2 Content<br />
                        WebUserControl 2 Content<br />
                        WebUserControl 2 Content<br />
                        WebUserControl 2 Content<br />
                        WebUserControl 2 Content<br />
                        WebUserControl 2 Content<br />
                        WebUserControl 2 Content<br />
                        end<br />
                    </div>
                </telerik:RadPane>
            </telerik:RadSplitter>
        </telerik:RadPane>
    </telerik:RadSplitter>

    WebUserControl2.ascx.vb
    Public Class WebUserControl2
        Inherits System.Web.UI.UserControl
     
        Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
            Dim hiddenfield = DirectCast(Page.FindControl("UserControl2Splitter"), HiddenField)
            hiddenfield.Value = RadSplitter.ClientID
        End Sub
     
         
    End Class
  2. Mira
    Admin
    Mira avatar
    1124 posts

    Posted 03 Nov 2011 Link to this post

    Hello Shunman,

    Could you please send us a live uRL of the problematic page?
    We will examine it and get back to you with our findings.

    Best wishes,
    Mira
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now
  3. shunman
    shunman avatar
    77 posts
    Member since:
    Jul 2011

    Posted 03 Nov 2011 Link to this post

    Hi . Telerik.

    I'm sorry. We do not have live web server. I'm testing my local computer.

    could you refer attaching code? it has same issue.

    thanks.



  4. Mira
    Admin
    Mira avatar
    1124 posts

    Posted 08 Nov 2011 Link to this post

    Hello Shunman,

    I tried to replicate the issue which you described, but to no avail - the usercontrols in the first and in the second menu are resized properly when the window is resized.
    Attached to this post, you will find the code which I used for testing.

    Please, take a look at it and let me know if there are any differences at your end, which I may be leaving out.

    All the best,
    Mira
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now
  5. shunman
    shunman avatar
    77 posts
    Member since:
    Jul 2011

    Posted 08 Nov 2011 Link to this post

    Hello Mira.
    Thank you for reply.

    Your samples are correct.
    Already  I have solved previous issue.

    I set "onclientLoad" event on each usercontrol's splitter with default page's splitter
    and added onclientresized event on default page's splitter

    This code works good.
    Would you please check my code has potential risk?
    I'm attaching source code

    http://www.megaupload.com/?d=R9JZ5ZKY

    thank you
  6. Mira
    Admin
    Mira avatar
    1124 posts

    Posted 10 Nov 2011 Link to this post

    Hello Shunman,

    I looked through your code and I could not see any obvious mistakes.
    However, if any issues with it arise, please open a formal support ticket and send us the project in it.

    I hope this helps.

    All the best,
    Mira
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now
Back to Top