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

Chrome specific issue when used silverlight control inside RadPageView control

3 Answers 33 Views
TabStrip
This is a migrated thread and some comments may be shown as answers.
Sampada
Top achievements
Rank 1
Sampada asked on 19 Apr 2013, 11:00 AM

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>

3 Answers, 1 is accepted

Sort by
0
Nencho
Telerik team
answered on 24 Apr 2013, 10:27 AM
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.
0
Bijender
Top achievements
Rank 1
answered on 30 Sep 2013, 05:04 PM
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".
0
Nencho
Telerik team
answered on 03 Oct 2013, 11:35 AM
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.
Tags
TabStrip
Asked by
Sampada
Top achievements
Rank 1
Answers by
Nencho
Telerik team
Bijender
Top achievements
Rank 1
Share this question
or