This is a migrated thread and some comments may be shown as answers.

SSRS Report Controls Inside of RadMultiPage - Display Issue

7 Answers 53 Views
TabStrip
This is a migrated thread and some comments may be shown as answers.
Chintan
Top achievements
Rank 2
Chintan asked on 03 Nov 2011, 06:28 PM


 I am trying to build a simple web page with RAD TabStrip Control from Telerik. The Mulitpage controls corresponding to the TabStrip controls have an SSRS report item embedded inside of it. When debugging the application from within Visual Studio, I see the first Tab correctly but all other tabs have a problem. The SSRS report item within all other tabs is shrinked to an item that is only 1 pixel wide. Almost invisibile but if you look closely you can notice. Using Visual Studio 2010 and SSRS 2008.


 

<asp:Content ID="BodyContent" ContentPlaceHolderID="BodyContent" runat="server"
  
<telerik:RadScriptManager ID="ScriptManager1" runat="server" EnableTheming="True"
</telerik:RadScriptManager
  
<br /> 
  
<telerik:RadTabStrip ID="RadTabStrip1" runat="server" SelectedIndex="3" 
     ReorderTabsOnSelect="True" Skin="Outlook" style="margin-bottom: 41" 
     MultiPageID="RadMultiPage1"
    <Tabs
    <telerik:RadTab runat="server" Text="Item 1" Selected="True"
    </telerik:RadTab
    <telerik:RadTab runat="server" Text="Item 2"
    </telerik:RadTab
    <telerik:RadTab runat="server" Text="Item 3"
    </telerik:RadTab
    <telerik:RadTab runat="server" Text="Item 4"
    </telerik:RadTab
    </Tabs
</telerik:RadTabStrip
  
<telerik:RadMultiPage ID="RadMultiPage1" runat="server" BorderColor="Black" 
    BorderStyle="Solid" BorderWidth="1px" SelectedIndex="3"
  
<telerik:RadPageView ID="RadPageView1" runat="server" Selected="True" Width="100%"
    <div style="width: 100%; min-width: 100px"
    <rsweb:ReportViewer ID="ReportViewer1" runat="server" Font-Names="Verdana" 
    Font-Size="8pt" InteractiveDeviceInfos="(Collection)" ProcessingMode="Remote" 
    WaitMessageFont-Names="Verdana" WaitMessageFont-Size="14pt" Width="100%" 
    CssClass="aspNetDisabled"
    <ServerReport ReportPath="^^^Some Path Goes in here^^^" /> 
    </rsweb:ReportViewer
    </div
</telerik:RadPageView
  
<telerik:RadPageView ID="RadPageView2" runat="server" Width="100%"
    <div style="width: 100%; min-width: 100px"
    <rsweb:ReportViewer ID="ReportViewer2" runat="server" Font-Names="Verdana" 
    Font-Size="8pt" InteractiveDeviceInfos="(Collection)" ProcessingMode="Remote" 
    WaitMessageFont-Names="Verdana" WaitMessageFont-Size="14pt" Width="100%" 
    CssClass="aspNetDisabled"
    <ServerReport ReportPath="^^^Some Path Goes in here^^^" /> 
    </rsweb:ReportViewer
    </div
</telerik:RadPageView
  
 <telerik:RadPageView ID="RadPageView3" runat="server" Width="100%"
     <div style="width: 100%"
    <rsweb:ReportViewer ID="ReportViewer3" runat="server" Font-Names="Verdana" 
    Font-Size="8pt" InteractiveDeviceInfos="(Collection)" ProcessingMode="Remote" 
    WaitMessageFont-Names="Verdana" WaitMessageFont-Size="14pt" Width="100%" 
    CssClass="aspNetDisabled"
    <ServerReport ReportPath="^^^Some Path Goes in here^^^" /> 
    </rsweb:ReportViewer
    </div
</telerik:RadPageView
  
<telerik:RadPageView ID="RadPageView4" runat="server" Width="100%"
    <div style="width: 100%"
    <rsweb:ReportViewer ID="ReportViewer4" runat="server" Font-Names="Verdana" 
    Font-Size="8pt" InteractiveDeviceInfos="(Collection)" ProcessingMode="Remote" 
    WaitMessageFont-Names="Verdana" WaitMessageFont-Size="14pt" Width="100%" 
    CssClass="aspNetDisabled"
    <ServerReport ReportPath="^^^Some Path Goes in here^^^" /> 
    </rsweb:ReportViewer
    </div
</telerik:RadPageView
</telerik:RadMultiPage
  
<br /> 
  
</asp:Content

 

asp:Content>

 

7 Answers, 1 is accepted

Sort by
0
Dimitar Terziev
Telerik team
answered on 08 Nov 2011, 10:06 AM
Hi Chintan,

Since you have opened a support ticket regarding the same problem, my suggestion is to keep the discussion there.

All the best,
Dimitar Terziev
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
0
MBEN
Top achievements
Rank 1
Veteran
answered on 05 Mar 2015, 08:52 PM
I have a similar setup.
Can i get a solution on how to implement this?
0
MBEN
Top achievements
Rank 1
Veteran
answered on 05 Mar 2015, 09:16 PM
The trouble I am having is the first time i click on the tabs the report viewer renders fine. When I click on a previous tab then the report viewer disappears. Below is my declaration.
<div>
        <telerik:RadAjaxPanel runat="server">
            <telerik:RadTabStrip runat="server" ID="_tabs" MultiPageID="rmpCashValues" SelectedIndex="0">
                <Tabs>
 
                    <telerik:RadTab Text="Q1 Cash Values"></telerik:RadTab>
                    <telerik:RadTab Text="Q2 Cash Values"></telerik:RadTab>
                    <telerik:RadTab Text="Q3 Cash Values"></telerik:RadTab>
                    <telerik:RadTab Text="Q4 Cash Values"></telerik:RadTab>
 
                </Tabs>
 
            </telerik:RadTabStrip>
 
            <telerik:RadMultiPage runat="server" ID="rmpCashValues" SelectedIndex="0">
                <telerik:RadPageView runat="server" ID="_q1CashValuesTab">
                    <div style="font-weight: bold; font-size: 10px;">
                        Click by Carrier Names to see individual detail.<br />
                        Unless otherwise noted, cash values shown are actual values from the insurance carrier
                                and are updated within 10 business days of month-end. An "n/a" indicates values
                                that are not yet available.<br />
                        <asp:Literal ID="litQ1ProjectedCashValueNote" Visible="False" runat="server" Text="*Cash values shown for these policies are
                                projections based on actual prior calendar year-end values.  Projected values are not guaranteed.
                                Changes in the policy crediting rates or charges,  as well as the timing of interest credits and
                                mortality cost deductions may cause actual cash values to differ from amounts shown."></asp:Literal>
                        <br />
                        <asp:Literal ID="_q1CashValueHeader" runat="server" />
                    </div>
                    <rsweb:ReportViewer ID="_q1CashValues" runat="server" Width="100%" Font-Names="Verdana"
                        Font-Size="8pt" ShowPageNavigationControls="False" ShowParameterPrompts="False"
                        ShowRefreshButton="False" Height="400px">
                        <LocalReport ReportPath="administration\CashValues\q1CashValues.rdlc">
                            <DataSources>
                                <rsweb:ReportDataSource DataSourceId="_dataSrcMonthlyCashValues" Name="CashValues_usp_PolicyAccounting_ListByClientAndDate" />
                            </DataSources>
                        </LocalReport>
                    </rsweb:ReportViewer>
                </telerik:RadPageView>
 
                <telerik:RadPageView runat="server" ID="_q2CashValuesTab">
                    <div style="font-weight: bold; font-size: 10px;">
                        Click by Carrier Names to see individual detail.<br />
                        Unless otherwise noted, cash values shown are actual values from the insurance carrier
                                and are updated within 10 business days of month-end. An "n/a" indicates values
                                that are not yet available.<br />
                        <asp:Literal ID="litQ2ProjectedCashValueNote" Visible="false" runat="server">*Cash values shown for these policies are
                                projections based on actual prior calendar year-end values.  Projected values are not guaranteed.
                                Changes in the policy crediting rates or charges,  as well as the timing of interest credits and
                                mortality cost deductions may cause actual cash values to differ from amounts shown.</asp:Literal>
                        <br />
                        <asp:Literal ID="_q2CashValueHeader" runat="server" />
                    </div>
                    <rsweb:ReportViewer ID="_q2CashValues" runat="server" Width="100%" InternalBorderWidth="1"
                        Font-Names="Verdana" Font-Size="8pt" ShowToolBar="true" AsyncRendering="true"
                        ShowPageNavigationControls="false" ShowParameterPrompts="false" ShowRefreshButton="false">
                        <LocalReport ReportPath="administration\CashValues\q2CashValues.rdlc">
                            <DataSources>
                                <rsweb:ReportDataSource DataSourceId="_dataSrcMonthlyCashValues" Name="CashValues_usp_PolicyAccounting_ListByClientAndDate" />
                            </DataSources>
                        </LocalReport>
                    </rsweb:ReportViewer>
                </telerik:RadPageView>
 
                <telerik:RadPageView runat="server" ID="_q3CashValuesTab">
 
                    <div style="font-weight: bold; font-size: 10px;">
                        Click by Carrier Names to see individual detail.<br />
                        Unless otherwise noted, cash values shown are actual values from the insurance carrier
                                and are updated within 10 business days of month-end. An "n/a" indicates values
                                that are not yet available.<br />
                        <asp:Literal ID="litQ3ProjectedCashValueNote" Visible="false" runat="server">*Cash values shown for these policies are
                                projections based on actual prior calendar year-end values.  Projected values are not guaranteed.
                                Changes in the policy crediting rates or charges,  as well as the timing of interest credits and
                                mortality cost deductions may cause actual cash values to differ from amounts shown.</asp:Literal>
                        <br />
                        <asp:Literal ID="_q3CashValueHeader" runat="server" />
                    </div>
                    <rsweb:ReportViewer ID="_q3CashValues" runat="server" Width="100%" InternalBorderWidth="1"
                        Font-Names="Verdana" Font-Size="8pt" ShowToolBar="true" AsyncRendering="true"
                        ShowPageNavigationControls="false" ShowParameterPrompts="false" ShowRefreshButton="false">
                        <LocalReport ReportPath="administration\CashValues\q3CashValues.rdlc">
                            <DataSources>
                                <rsweb:ReportDataSource DataSourceId="_dataSrcMonthlyCashValues" Name="CashValues_usp_PolicyAccounting_ListByClientAndDate" />
                            </DataSources>
                        </LocalReport>
                    </rsweb:ReportViewer>
                </telerik:RadPageView>
                <telerik:RadPageView runat="server" ID="_q4CashValuesTab">
                    <div style="font-weight: bold; font-size: 10px;">
                        Click by Carrier Names to see individual detail.<br />
                        Unless otherwise noted, cash values shown are actual values from the insurance carrier
                                and are updated within 10 business days of month-end. An "n/a" indicates values
                                that are not yet available.<br />
                        <asp:Literal ID="litQ4ProjectedCashValueNote" Visible="false" runat="server">*Cash values shown for these policies are
                                projections based on actual prior calendar year-end values.  Projected values are not guaranteed.
                                Changes in the policy crediting rates or charges,  as well as the timing of interest credits and
                                mortality cost deductions may cause actual cash values to differ from amounts shown.</asp:Literal>
                        <br />
                        <asp:Literal ID="_q4CashValueHeader" runat="server" />
                    </div>
                    <rsweb:ReportViewer ID="_q4CashValues" runat="server" Width="100%" InternalBorderWidth="1"
                        Font-Names="Verdana" Font-Size="8pt" ShowToolBar="true" AsyncRendering="true"
                        ShowPageNavigationControls="false" ShowParameterPrompts="false" ShowRefreshButton="false">
                        <LocalReport ReportPath="administration\CashValues\q4CashValues.rdlc">
                            <DataSources>
                                <rsweb:ReportDataSource DataSourceId="_dataSrcMonthlyCashValues" Name="CashValues_usp_PolicyAccounting_ListByClientAndDate" />
                            </DataSources>
                        </LocalReport>
                    </rsweb:ReportViewer>
                </telerik:RadPageView>
            </telerik:RadMultiPage>
 
        </telerik:RadAjaxPanel>
 
    </div>
    <asp:ObjectDataSource ID="_dataSrcMonthlyCashValues" runat="server" SelectMethod="ListByClientAndDate"
        TypeName="DBLib.CashValues" OnSelected="_dataSrcMonthlyCashValues_Selected">
        <SelectParameters>
            <asp:ProfileParameter Name="ClientID" PropertyName="ClientID" DefaultValue="-1" Type="Int32" />
            <asp:Parameter Name="beginDate" DefaultValue="1/1/2007" Type="DateTime" />
        </SelectParameters>
    </asp:ObjectDataSource>
0
Chintan
Top achievements
Rank 2
answered on 05 Mar 2015, 09:26 PM
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="AssociateSearch.Default" MasterPageFile="~/MasterPages/Site.Master"%>
 
<%@ MasterType VirtualPath="~/MasterPages/Site.Master"  %>
 
<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
 
<%@ Register assembly="Microsoft.ReportViewer.WebForms, Version=10.0.0.0, Culture=neutral, PublicKeyToken=b03f5f7f11d50a3a" namespace="Microsoft.Reporting.WebForms" tagprefix="rsweb" %>
 
<asp:Content ID="HeadContent" ContentPlaceHolderID="HeadContent" runat="server">
 
    <link rel="Stylesheet" type="text/css" href="css/subpages.css" />
     
    <script type="text/javascript">
 
            function OnClientTabSelecting(sender, args) {
 
                var id = args.get_tab().get_pageView().get_id();
 
                if (sender.get_selectedTab()) {
                    var oldID = sender.get_selectedTab().get_pageView().get_id();
                    if ($telerik.$("#" + oldID).is(":visible")) {
                        args.set_cancel(true);
                        $telerik.$("#" + oldID).fadeOut(500, function () { args.get_tab().select(); });
                        return;
                    }
                }
 
                $telerik.$("#" + id).fadeOut("fast");
                $telerik.$("#" + id).fadeIn(2000);
            }
             
    </script>
 
</asp:Content>
 
<asp:Content ID="BodyContent" ContentPlaceHolderID="BodyContent" runat="server">
 
    <telerik:RadScriptManager ID="ScriptManager1" runat="server" EnableTheming="True">
    </telerik:RadScriptManager>
 
    <div style="padding-left: 5px">
    <telerik:RadButton ID="linkToPortal" runat="server" Text=" Audit Portal "
        ButtonType="LinkButton" Font-Names="Verdana" Font-Size="10pt"
        Skin="Default" Width="15%" NavigateUrl="http://mycompany.com:95/Portal/"
        Target="_self" BackColor="#AA0015" BorderColor="White" BorderStyle="Solid"
        BorderWidth="1px" Height="25px" ToolTip="Go to Home Page"
        Font-Underline="False" ForeColor="White" TabIndex="10">
    </telerik:RadButton>
    <span>     </span>
 
    </div>
     
<%--    <hr style="color: #FFFFFF; height: 1px" />
--%>   
 
    <asp:Label ID="labelWelcome" runat="server" visible="false" Text="Welcome [[User]]"></asp:Label>
 
<%--    <hr style="color: #FFFFFF; height: 1px" />
--%>
    <div style="margin: auto; Width: 800px">
 
        <telerik:RadTextBox ID="RadTextBox1" runat="server" BorderColor="Red"
            Text="Welcome Message"
            ReadOnly="True" ForeColor="#FF3300" Width="800px" style="text-align: center" 
            LabelWidth="800px">
        </telerik:RadTextBox>
 
    </div>
 
    <hr style="color: #FFFFFF; height: 1px" />
 
    <div style="height: 500px" >
 
    <telerik:RadTabStrip ID="RadTabStrip1" runat="server" SelectedIndex="0"
        ReorderTabsOnSelect="True" style="margin-bottom: 41"
        MultiPageID="RadMultiPage1" Align="Center"
        OnClientTabSelecting="OnClientTabSelecting" Visible="False">
        <Tabs>
            <telerik:RadTab runat="server" Text="Tab_1" Selected="True"
                PageViewID="RadPageView1">
            </telerik:RadTab>
            <telerik:RadTab runat="server" Text="Tab_2"
                PageViewID="RadPageView2">
            </telerik:RadTab>
            <telerik:RadTab runat="server" Text="Tab_3"
                PageViewID="RadPageView3">
            </telerik:RadTab>
            <telerik:RadTab runat="server" Text="Tab_4"
                PageViewID="RadPageView4">
            </telerik:RadTab>
            <telerik:RadTab runat="server" Text="Tab_5"
                PageViewID="RadPageView5">
            </telerik:RadTab>
        </Tabs>
    </telerik:RadTabStrip>
     
    <telerik:RadMultiPage ID="RadMultiPage1" runat="server" BorderColor="Black"
        BorderStyle="Solid" BorderWidth="1px" SelectedIndex="0" Visible="false">
         
        <telerik:RadPageView ID="RadPageView1" runat="server" Selected="True" style="min-height: 450px">
            <rsweb:ReportViewer ID="ReportViewer1" runat="server" Font-Names="Verdana"
                Font-Size="8pt" InteractiveDeviceInfos="(Collection)" ProcessingMode="Remote"
                 WaitMessageFont-Names="Verdana" WaitMessageFont-Size="14pt"
                 CssClass="aspNetDisabled" Height="460px"><ServerReport ReportPath="/Directory_1/Report_1" /></rsweb:ReportViewer>
        </telerik:RadPageView>
         
        <telerik:RadPageView ID="RadPageView2" runat="server" style="min-height: 450px">
            <rsweb:ReportViewer ID="ReportViewer2" runat="server" Font-Names="Verdana"
                Font-Size="8pt" InteractiveDeviceInfos="(Collection)" ProcessingMode="Remote"
                WaitMessageFont-Names="Verdana" WaitMessageFont-Size="14pt"
                CssClass="aspNetDisabled" Height="460px"><ServerReport ReportPath="/Directory_1/Report_2" /></rsweb:ReportViewer>
        </telerik:RadPageView>
         
        <telerik:RadPageView ID="RadPageView3" runat="server" style="min-height: 450px">
            <rsweb:ReportViewer ID="ReportViewer3" runat="server" Font-Names="Verdana"
                Font-Size="8pt" InteractiveDeviceInfos="(Collection)" ProcessingMode="Remote"
                WaitMessageFont-Names="Verdana" WaitMessageFont-Size="14pt"
                CssClass="aspNetDisabled" Height="460px"><ServerReport ReportPath="/Directory_1/Report_3" /></rsweb:ReportViewer>
        </telerik:RadPageView>
         
        <telerik:RadPageView ID="RadPageView4" runat="server" style="min-height: 450px">
            <rsweb:ReportViewer ID="ReportViewer4" runat="server" Font-Names="Verdana"
               Font-Size="8pt" InteractiveDeviceInfos="(Collection)" ProcessingMode="Remote"
               WaitMessageFont-Names="Verdana" WaitMessageFont-Size="14pt"
               CssClass="aspNetDisabled" Height="460px"><ServerReport ReportPath="/Directory_1/Report_4" /></rsweb:ReportViewer>
        </telerik:RadPageView>
 
        <telerik:RadPageView ID="RadPageView5" runat="server" style="min-height: 450px">
            <rsweb:ReportViewer ID="ReportViewer5" runat="server" Font-Names="Verdana"
               Font-Size="8pt" InteractiveDeviceInfos="(Collection)" ProcessingMode="Remote"
               WaitMessageFont-Names="Verdana" WaitMessageFont-Size="14pt" 
               CssClass="aspNetDisabled" Height="460px"><ServerReport ReportPath="/Directory_1/Report_5" /></rsweb:ReportViewer>
        </telerik:RadPageView>
     
    </telerik:RadMultiPage>
     
    </div>
 
    <div style="text-align: center; vertical-align: middle;">
    <asp:Label ID="lblCounter" runat="server" Text="Label" Font-Names="Verdana" Font-Size="10pt"
    Width="20%" BackColor="#AA0015" BorderColor="White" BorderStyle="Solid"
    BorderWidth="3px" Height="25px" ToolTip="Total visits to this page."
    Font-Underline="False" ForeColor="White"></asp:Label>
    </div>
 
</asp:Content>
0
MBEN
Top achievements
Rank 1
Veteran
answered on 05 Mar 2015, 09:37 PM
Thanks for the help.Unfortunately that didn't work for me.

I have attached a screenshot of what i see on first load and if I go back to that tab after clicking on another tab.
0
Nencho
Telerik team
answered on 10 Mar 2015, 03:18 PM
Hello MBEN,

As I can see from the provided code snippet, you have the RadTabStrip and the MultiPage, wrapped within an RadAjaxPanel. Could you please remove it and test if the problematic behavior still occurs, as there might be some issue loading the ReportViewer in such scenario.

Regards,
Nencho
Telerik
 

Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

 
0
MBEN
Top achievements
Rank 1
Veteran
answered on 12 Mar 2015, 06:12 PM
I removed the RadAjaxPanel but I still see the same behavior.
The only way I can get the tabs to load is if i force a postback on each tab selected event.

It takes time to load the reports each time so I don't want to force a postback on tab click.

Please suggest.
Tags
TabStrip
Asked by
Chintan
Top achievements
Rank 2
Answers by
Dimitar Terziev
Telerik team
MBEN
Top achievements
Rank 1
Veteran
Chintan
Top achievements
Rank 2
Nencho
Telerik team
Share this question
or