Chrome specific issue when used silverlight control inside RadPageView control

4 posts, 0 answers
  1. Sampada
    Sampada avatar
    44 posts
    Member since:
    Feb 2012

    Posted 19 Apr 2013 Link to this post

    We are having a problem with silver-light control that is inside <telerik:RadPageView/>.  

    The issue is, it loads properly on IE; but doesn’t work on Chrome and FF browser. However, it is working fine when used outside the RadPageView control.

    Could you please provide us a solution to resolve this?


    Please refer application code to reproduce this issue.


    ASPX page
    <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="RadChartInASP.NET.Web._Default" %>
     
    <%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
    <%@ Register Assembly="System.Web.Silverlight" Namespace="System.Web.UI.SilverlightControls"
        TagPrefix="asp" %>
    <!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>
    </head>
    <body style="height: 100%; margin: 0;">
        <form id="form1" runat="server" style="height: 100%;" dir="ltr">
        <script type="text/javascript">
            var silverlightControl;
            function pluginLoaded(sender) {
                // get reference to the silverlight control on the page
                silverlightControl = sender.get_element();
            }
            function ColorChanged(sender, args) {
                silverlightControl.content.slChartPage.SeriesColor = sender.get_selectedColor();
            }
            function Show3D_Click(sender) {
                var checked = sender.checked;
                silverlightControl.content.slChartPage.Show3D = checked;
                if (checked) {
                    $get("ColorPicker").style.display = "none";
                    $get("ColorPickerLbl").style.display = "none";
                    $get("ShowTooltips").style.display = "none";
                    $get("ShowTooltipsLbl").style.display = "none";
                    $get("HideElements").style.display = "block";
                    $get("HideElementsLbl").style.display = "block";
                    $get("HideElementsOnRotation").checked = false;
                }
                else {
                    $get("ColorPicker").style.display = "block";
                    $get("ColorPickerLbl").style.display = "block";
                    $get("ShowTooltips").style.display = "block";
                    $get("ShowTooltipsLbl").style.display = "block";
                    $get("ShowItemTooltips").checked = false;
                    $get("HideElements").style.display = "none";
                    $get("HideElementsLbl").style.display = "none";
                }
            }
            function AxisXTitleTextBox_Changed(sender, args) {
                silverlightControl.content.slChartPage.AxisXTitle = args.get_newValue();
            }
            function AxisYTitleTextBox_Changed(sender, args) {
                silverlightControl.content.slChartPage.AxisYTitle = args.get_newValue();
            }
            function ShowItemLabels_Click(sender) {
                silverlightControl.content.slChartPage.ShowItemLabels = sender.checked;
            }
            function ShowItemTooltips_Click(sender) {
                silverlightControl.content.slChartPage.ShowItemTooltips = sender.checked;
            }
            function HideElementsOnRotation_Click(sender) {
                silverlightControl.content.slChartPage.HideElementsOnRotation = sender.checked;
            }
            function ShowXAxis_Click(sender) {
                silverlightControl.content.slChartPage.ShowXAxis = sender.checked;
            }
            function ShowYAxis_Click(sender) {
                silverlightControl.content.slChartPage.ShowYAxis = sender.checked;
            }
            function ShowXAxisGridlines_Click(sender) {
                silverlightControl.content.slChartPage.ShowXAxisGridlines = sender.checked;
            }
            function ShowYAxisGridlines_Click(sender) {
                silverlightControl.content.slChartPage.ShowYAxisGridlines = sender.checked;
            }
            function ShowXAxisStriplines_Click(sender) {
                silverlightControl.content.slChartPage.ShowXAxisStriplines = sender.checked;
            }
            function ShowYAxisStriplines_Click(sender) {
                silverlightControl.content.slChartPage.ShowYAxisStriplines = sender.checked;
            }
            function AxisXFormat_Changed(sender, args) {
                silverlightControl.content.slChartPage.AxisXFormat = args.get_item().get_text();
            }
            function AxisYFormat_Changed(sender, args) {
                silverlightControl.content.slChartPage.AxisYFormat = args.get_item().get_text();
            }
            function ItemsFormat_Changed(sender, args) {
                silverlightControl.content.slChartPage.ItemsFormat = args.get_item().get_text();
            }
            function SeriesColorCombo_Changed(sender, args) {
                silverlightControl.content.slChartPage.SeriesColor = args.get_item().get_text();
            }
        </script>
        <asp:ScriptManager ID="ScriptManager1" runat="server">
        </asp:ScriptManager>
        <div style="height: 400px;">
            <telerik:RadTabStrip ID="tabConfigure" Width="100%" ClientIDMode="Static" runat="server"
                Style="position: relative; margin-left: 0px;" MultiPageID="ConfiguraionPan">
                <Tabs>
                    <telerik:RadTab Text="Admin" Value="Admin" runat="server" PageViewID="pvAdmin">
                    </telerik:RadTab>
                    <telerik:RadTab Text="Dashboard" runat="server" PageViewID="pvCharts" Value="Charting">
                    </telerik:RadTab>
                </Tabs>
            </telerik:RadTabStrip>
            <asp:Silverlight ID="Xaml1" runat="server" Source="~/ClientBin/RadChartInASP.NET.xap"
                MinimumVersion="2.0.30728.0" Width="100%" Height="100%" OnPluginLoaded="pluginLoaded" />
        </div>
        <telerik:RadMultiPage ID="ConfiguraionPan" Width="100%" CssClass="multiPage" runat="server"
            ClientIDMode="Static">
            <telerik:RadPageView ID="ConfugarationPan" runat="server" Height="100%" Width="100%"
                ClientIDMode="Static">
            </telerik:RadPageView>
            <telerik:RadPageView ID="pvDashboard" runat="server" Height="100%" Width="100%" ClientIDMode="Static">
            </telerik:RadPageView>
            <telerik:RadPageView ID="pvCharts" runat="server" Height="100%" Width="100%" ClientIDMode="Static">
                <table>
                    <tr>
                        <td>
                            Show 3D chart:
                        </td>
                        <td>
                            <asp:CheckBox ID="Show3D" runat="server" onclick="Show3D_Click(this);" />
                        </td>
                        <td>
                        </td>
                        <td>
                        </td>
                        <td>
                        </td>
                        <td>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <div id="ColorPickerLbl">
                                Series color:
                            </div>
                        </td>
                        <td>
                            <div id="ColorPicker">
                                <telerik:RadColorPicker ID="RadColorPicker1" runat="server" ShowEmptyColor="false"
                                    Preset="Standard" OnClientColorChange="ColorChanged">
                                </telerik:RadColorPicker>
                            </div>
                        </td>
                        <td>
                              
                        </td>
                        <td>
                              
                        </td>
                        <td>
                              
                        </td>
                        <td>
                              
                        </td>
                    </tr>
                    <tr>
                        <td>
                            AxisXTitle:
                        </td>
                        <td>
                            <telerik:RadTextBox ID="AxisXTitleTextBox" runat="server" Width="220px">
                                <ClientEvents OnValueChanged="AxisXTitleTextBox_Changed" />
                            </telerik:RadTextBox>
                        </td>
                        <td>
                            <div id="ShowTooltips">
                                <asp:CheckBox ID="ShowItemTooltips" runat="server" onclick="ShowItemTooltips_Click(this);" />
                            </div>
                            <div id="HideElements" style="display: none;">
                                <asp:CheckBox ID="HideElementsOnRotation" runat="server" onclick="HideElementsOnRotation_Click(this);" />
                                <br />
                            </div>
                        </td>
                        <td>
                            <div id="ShowTooltipsLbl">
                                Show item tooltips.
                            </div>
                            <div id="HideElementsLbl" style="display: none;">
                                Hide elements on rotation
                            </div>
                        </td>
                        <td>
                            <asp:CheckBox ID="ShowXAxisGridlines" runat="server" onclick="ShowXAxisGridlines_Click(this);" />
                        </td>
                        <td>
                            Show X axis gridlines.
                        </td>
                    </tr>
                    <tr>
                        <td>
                            AxisYTitle:
                        </td>
                        <td>
                            <telerik:RadTextBox ID="AxisYTitleTextBox" runat="server" Width="220px">
                                <ClientEvents OnValueChanged="AxisYTitleTextBox_Changed" />
                            </telerik:RadTextBox>
                        </td>
                        <td>
                            <asp:CheckBox ID="ShowItemLabels" runat="server" Checked="true" onclick="ShowItemLabels_Click(this);" />
                        </td>
                        <td>
                            Show item labels.
                        </td>
                        <td>
                            <asp:CheckBox ID="ShowYAxisGridlines" runat="server" onclick="ShowYAxisGridlines_Click(this);" />
                        </td>
                        <td>
                             Show Y axis gridlines.
                        </td>
                    </tr>
                    <tr>
                        <td>
                            Axis X format:
                        </td>
                        <td>
                            <telerik:RadComboBox ID="AxisXFormat" runat="server" OnClientSelectedIndexChanged="AxisXFormat_Changed"
                                Width="220px">
                                <Items>
                                    <telerik:RadComboBoxItem Text="MMM/dd/yy" />
                                    <telerik:RadComboBoxItem Text="MM/dd/yyyy" />
                                    <telerik:RadComboBoxItem Text="Day: #VAL{dddd}" />
                                    <telerik:RadComboBoxItem Text="HH:mm:ss" />
                                    <telerik:RadComboBoxItem Text="yyyy MMMM" />
                                </Items>
                            </telerik:RadComboBox>
                        </td>
                        <td>
                            <asp:CheckBox ID="ShowXAxis" runat="server" Checked="true" onclick="ShowXAxis_Click(this);" />
                        </td>
                        <td>
                            Show X axis.
                        </td>
                        <td>
                            <asp:CheckBox ID="ShowXAxisStriplines" runat="server" onclick="ShowXAxisStriplines_Click(this);" />
                        </td>
                        <td>
                             Show X axis striplines.
                        </td>
                    </tr>
                    <tr>
                        <td>
                            Axis Y format:
                        </td>
                        <td>
                            <telerik:RadComboBox ID="AxisYFormat" runat="server" OnClientSelectedIndexChanged="AxisYFormat_Changed"
                                Width="220px">
                                <Items>
                                    <telerik:RadComboBoxItem Text="N" />
                                    <telerik:RadComboBoxItem Text="C" />
                                    <telerik:RadComboBoxItem Text="Amount: #VAL{C0}" />
                                </Items>
                            </telerik:RadComboBox>
                        </td>
                        <td>
                            <asp:CheckBox ID="ShowYAxis" runat="server" Checked="true" onclick="ShowYAxis_Click(this);" />
                        </td>
                        <td>
                            Show Y axis.
                        </td>
                        <td>
                            <asp:CheckBox ID="ShowYAxisStriplines" runat="server" Checked="true" onclick="ShowYAxisStriplines_Click(this);" />
                        </td>
                        <td>
                            Show Y axis striplines.
                        </td>
                    </tr>
                    <tr>
                        <td>
                            Chart item format:
                        </td>
                        <td>
                            <telerik:RadComboBox ID="ChartItemFormat" runat="server" OnClientSelectedIndexChanged="ItemsFormat_Changed"
                                Width="220px">
                                <Items>
                                    <telerik:RadComboBoxItem Text="N" />
                                    <telerik:RadComboBoxItem Text="C" />
                                    <telerik:RadComboBoxItem Text="Amount: #Y{C0}" />
                                </Items>
                            </telerik:RadComboBox>
                        </td>
                        <td>
                        </td>
                        <td>
                        </td>
                        <td>
                        </td>
                        <td>
                        </td>
                    </tr>
                </table>
            </telerik:RadPageView>
        </telerik:RadMultiPage>
        <telerik:RadFormDecorator ID="RadFormDecorator1" runat="server" Skin="Telerik" DecoratedControls="All" />
        </form>
    </body>
    </html>
  2. Nencho
    Admin
    Nencho avatar
    1458 posts

    Posted 24 Apr 2013 Link to this post

    Hello Sampada,

    I tried to replicate the described issue, but to no avail. I would like to ask you to provide us with the SilverLight control (Source="~/ClientBin/RadChartInASP.NET.xap"), which you use in the PageView, so we could investigate the issue further.

    All the best,
    Nencho
    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. UI for ASP.NET Ajax is Ready for VS 2017
  4. Bijender
    Bijender avatar
    1 posts
    Member since:
    Aug 2013

    Posted 30 Sep 2013 Link to this post

    I am also facing the save issue with RadPageView control. Even if I right click on the page on chrome there will be no Silverlight context menu.
    On xaml page I just wrote "Hello world".
  5. Nencho
    Admin
    Nencho avatar
    1458 posts

    Posted 03 Oct 2013 Link to this post

    Hello Bijender,

    Since the issue, described in the previous post was not replicated, I would like to ask you to provide us with the implementation that you are using at your end, in order to inspect it and try to replicate it locally.

    Regards,
    Nencho
    Telerik
    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 the blog feed now.
Back to Top