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

RadRotator issues with controlbuttons, ajaxpanel,etc

1 Answer 96 Views
Rotator
This is a migrated thread and some comments may be shown as answers.
Meghanath Singh
Top achievements
Rank 1
Meghanath Singh asked on 15 Dec 2011, 09:31 AM

Hi, 

I've used radrotator to display some products. Below is the code sample, there are current two problems I'm facing (as listed below)

I'm showing the product description when either user selects the radrotatoritem or when user clicks on the ControlButtons.

1)If I toggle between either of this option I get an error (error screenshot attached)
2)If I toggle between either of this option the product description is shown incorrectly for  a product which i've not selected at all. This happens when i toggle between the ControlButtons and clicking on the products themselves.
3) Sometimes I get this error like the below one

A]System.Collections.Generic.List`1[SelectProducts+fileInfo] cannot be cast to [B]System.Collections.Generic.List`1[SelectProducts+fileInfo]. Type A originates from 'mscorlib, Version=2.0.0.0, Culture=neutral, PublicKeyToken=b77a5c561934e089' in the context 'LoadNeither' at location 'C:\Windows\assembly\GAC_32\mscorlib\2.0.0.0__b77a5c561934e089\mscorlib.dll'. Type B originates from 'mscorlib, Version=2.0.0.0, Culture=neutral, PublicKeyToken=b77a5c561934e089' in the context 'LoadNeither' at location 'C:\Windows\assembly\GAC_32\mscorlib\2.0.0.0__b77a5c561934e089\mscorlib.dll'.

Could you please help me resolve these issues? Thanks

private List<fileInfo> imagesArray

 

{

     //Error #3 is thrown here.

get { return (List<fileInfo>)ViewState["imagesArray"]; }

  set { ViewState["imagesArray"] = value; }

 

}

 

<%@ Page Title="" Language="C#" AutoEventWireup="true" CodeFile="SelectProducts.aspx.cs"
 
  
 
    Inherits="SelectProducts" %>
 
  
 
   
 
  
 
<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
 
  
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 
  
 
 
  
 
<head>
 
  
 
    <telerik:RadScriptBlock ID="as" runat="server">
 
  
 
   
 
  
 
        <script type="text/javascript">
 
  
 
   
 
  
 
            function OnClientItemClicked(sender, args) {
 
  
 
   
 
  
 
                sender.set_currentItemIndex(args.get_item().get_index(), true);
 
  
 
   
 
  
 
                var objArgs = sender.get_currentItem().get_index();
 
  
 
   
 
  
 
                $find("<%= RadAjaxManager1.ClientID %>").ajaxRequest(objArgs);
 
  
 
                  
 
  
 
            }
 
  
 
   
 
  
 
            function OnClientButtonClick(sender, args) {
 
  
 
   
 
  
 
    
 
  
 
                var objArgs = sender.get_currentItem().get_index();
 
  
 
                $find("<%= RadAjaxManager1.ClientID %>").ajaxRequest(objArgs);
 
  
 
            
 
  
 
            }
 
  
 
            function ShowDescription(sender, args) {
 
  
 
            }
 
  
 
        </script>
 
  
 
   
 
  
 
    </telerik:RadScriptBlock>
 
  
 
    <title>Vitti Login</title>
 
  
 
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 
  
 
    <link rel="shortcut icon" type="image/ico" href="Themes/Default/Images/Icons/icon_fav.ico" />
 
  
 
    <link id="Link1" rel="stylesheet" type="text/css" runat="server" href="Themes/Default/Stylesheet/base.css"
 
  
 
        media="all" />
 
  
 
    <style type="text/css">
 
  
 
        .rotatorBackground
 
  
 
        {
 
  
 
            margin: 0 auto;
 
  
 
            width: 800px;
 
  
 
            height: 400px;
 
  
 
            -moz-border-radius: 15px;
 
  
 
            -webkit-border-radius: 15px;
 
  
 
             
 
  
 
        }
 
  
 
            .rotNoButtonsBack
 
  
 
        {
 
  
 
            width: 810px;
 
  
 
               
 
  
 
              background:url(../Images/Backgrounds/bg_Products.jpg);
 
  
 
         background-repeat: no-repeat;
 
  
 
        }
 
  
 
   
 
  
 
        .rotatorStyle
 
  
 
        {
 
  
 
            margin: 40px auto 0px;
 
  
 
        }
 
  
 
        .rotatorStyle .RotatorItem
 
  
 
        {
 
  
 
            margin: 5px;
 
  
 
            height: 100px;
 
  
 
            width: 100px;
 
  
 
        }
 
  
 
        .rotatorCarouselStyle
 
  
 
        {
 
  
 
            margin: 0px auto;
 
  
 
        }
 
  
 
        .RotatorItem
 
  
 
        {
 
  
 
            border: solid 0px #666666 !important;
 
  
 
        }
 
  
 
        .mainDiv
 
  
 
        {
 
  
 
            margin-bottom: 20px;
 
  
 
        }
 
  
 
        .configurationPanel
 
  
 
        {
 
  
 
            width: 290px;
 
  
 
            border: 0px;
 
  
 
        }
 
  
 
    </style>
 
  
 
</head>
 
  
 
<body>
 
  
 
    <form id="form1" runat="server">
 
  
 
    <asp:ScriptManager ID="ScriptManager1" runat="server" AsyncPostBackTimeout="300">
 
  
 
    </asp:ScriptManager>
 
  
 
    <telerik:RadWindowManager Skin="Default" ID="RadWindowManager2" ShowContentDuringLoad="false"
 
  
 
        Modal="true" IconUrl="" VisibleStatusbar="false" ReloadOnShow="true" Behavior="Move,Close"
 
  
 
        DestroyOnClose="true" runat="server" Width="310">
 
  
 
    </telerik:RadWindowManager>
 
  
 
    <telerik:RadAjaxManager ID="RadAjaxManager1" OnAjaxRequest="RadAjaxManager1_AjaxRequest"
 
  
 
        runat="server" DefaultLoadingPanelID="LoadingPanel1">
 
  
 
        <AjaxSettings>
 
  
 
            <telerik:AjaxSetting AjaxControlID="radRotProducts">
 
  
 
                <UpdatedControls>
 
  
 
               
 
  
 
                    <telerik:AjaxUpdatedControl ControlID="detailsPanel" />
 
  
 
                </UpdatedControls>
 
  
 
            </telerik:AjaxSetting>
 
  
 
            <telerik:AjaxSetting AjaxControlID="chkRotationType">
 
  
 
                <UpdatedControls>
 
  
 
                    <telerik:AjaxUpdatedControl ControlID="radRotProducts" />
 
  
 
                </UpdatedControls>
 
  
 
            </telerik:AjaxSetting>
 
  
 
            <telerik:AjaxSetting AjaxControlID="RadAjaxManager1">
 
  
 
                <UpdatedControls>
 
  
 
                    <telerik:AjaxUpdatedControl ControlID="detailsPanel" />
 
  
 
                </UpdatedControls>
 
  
 
            </telerik:AjaxSetting>
 
  
 
        </AjaxSettings>
 
  
 
    </telerik:RadAjaxManager>
 
  
 
    <telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server" Transparency="30"
 
  
 
        EnableSkinTransparency="false" BackColor="#E0E0E0">
 
  
 
    </telerik:RadAjaxLoadingPanel>
 
  
 
    <div id="container">
 
  
 
        <!-- banner starts -->
 
  
 
        <div style="float: right; height: 30px; padding-right: 5px">
 
  
 
            <telerik:RadMenu Visible="false" ID="RadMenu2" runat="server" EnableRoundedCorners="true"
 
  
 
                EnableShadows="true" Skin="Windows7">
 
  
 
                <Items>
 
  
 
                    <telerik:RadMenuItem Text="About Us" AccessKey="A" Value="1">
 
  
 
                    </telerik:RadMenuItem>
 
  
 
                    <telerik:RadMenuItem IsSeparator="True" Visible="true" />
 
  
 
                    <telerik:RadMenuItem Text="Contact Us" AccessKey="C" Value="132">
 
  
 
                    </telerik:RadMenuItem>
 
  
 
                </Items>
 
  
 
            </telerik:RadMenu>
 
  
 
        </div>
 
  
 
        <div id="header_home">
 
  
 
            <div id="logo">
 
  
 
            </div>
 
  
 
            <div id="app_title" style="visibility: hidden">
 
  
 
            </div>
 
  
 
            <div id="client_logo">
 
  
 
                <asp:Image ID="imgCompanyLogo" runat="server" Height="36px" />
 
  
 
            </div>
 
  
 
        </div>
 
  
 
        <div style="clear: both">
 
  
 
        </div>
 
  
 
        <!-- banner ends -->
 
  
 
        <!-- menu starts -->
 
  
 
        <div>
 
  
 
            <table cellpadding="0" cellspacing="0" border="0" width="100%">
 
  
 
                <tr>
 
  
 
                    <td id="menubar_left">
 
  
 
                    </td>
 
  
 
                    <td id="menubar_middle">
 
  
 
                        <table width="100%" cellpadding="0" cellspacing="0" border="0">
 
  
 
                            <tr>
 
  
 
                                <td style="padding-top: 1px" align="right">
 
  
 
                                    <asp:CheckBox AutoPostBack="true" ID="chkRotationType" Text="Automatic" runat="server"
 
  
 
                                        Checked="true" OnCheckedChanged="chkRotationType_CheckedChanged" />
 
  
 
                                </td>
 
  
 
                            </tr>
 
  
 
                        </table>
 
  
 
                    </td>
 
  
 
                    <td id="menubar_right">
 
  
 
                    </td>
 
  
 
                </tr>
 
  
 
            </table>
 
  
 
        </div>
 
  
 
        <!-- menu ends -->
 
  
 
        <!-- body starts -->
 
  
 
        <div>
 
  
 
            <table cellpadding="0" cellspacing="0" border="0" width="100%">
 
  
 
                <tr>
 
  
 
                    <td id="bg_background_left">
 
  
 
                    </td>
 
  
 
                    <td id="bg_background_middle">
 
  
 
                        <div>
 
  
 
                            <telerik:RadAjaxPanel ID="AjaxPanel1" CssClass="rotNoButtonsBack" runat="server" LoadingPanelID="LoadingPanel1">
 
  
 
                                <div class="mainDiv">
 
  
 
                                    <div class="rotatorBackground">
 
  
 
                                        <%-- ItemWidth and ItemHeight include 2x5(pixels) margin and 1x2(pixels) border --%>
 
  
 
                                        <telerik:RadRotator ID="radRotProducts" RotatorType="CarouselButtons" runat="server"
 
  
 
                                            OnClientItemClicking ="OnClientItemClicked" EnableRandomOrder="true" PauseOnMouseOver="false"
 
  
 
                                            Width="800px" Height="400px" CssClass="rotatorCarouselStyle" ItemHeight="200"
 
  
 
                                            FrameDuration="2000" ItemWidth="300" ScrollDuration="500">
 
  
 
                                            <ItemTemplate>
 
  
 
                                                <asp:Image runat="server" ID="imgProduct" ImageUrl='<%#DataBinder.Eval(Container.DataItem,"Image")%>'
 
  
 
                                                    CssClass="RotatorItem" />
 
  
 
                                            </ItemTemplate>
 
  
 
                                           
 
  
 
                                            <ControlButtons  OnClientButtonClick ="OnClientButtonClick" />
 
  
 
                                        </telerik:RadRotator>
 
  
 
   
 
  
 
                                    </div>
 
  
 
                                </div>
 
  
 
                            </telerik:RadAjaxPanel>
 
  
 
                            <table border="0" cellpadding="3" cellspacing="2" width="750px" align="center" style="background-color: #f9f9f9;
 
  
 
                                border: 1px #f1f1f1 solid;">
 
  
 
                                <tr>
 
  
 
                                    <td class="infoPane">
 
  
 
                                        <div class="infoPaneBg" runat="server" id="detailsPanel">
 
  
 
                                            <div class="imageDetailsHeader">
 
  
 
                                                Image details:</div>
 
  
 
                                            <div id="viewPanel">
 
  
 
                                                <div class="details">
 
  
 
                                                    <strong>Name:</strong>
 
  
 
                                                    <asp:Label ID="labelImageName" runat="server"></asp:Label></div>
 
  
 
                                                <div class="details">
 
  
 
                                                    <strong>Keywords:</strong>
 
  
 
                                                    <asp:Label ID="labelImageKeywords" runat="server"></asp:Label></div>
 
  
 
                                                <div class="details">
 
  
 
                                                    <strong>Comments:</strong>
 
  
 
                                                    <asp:Label ID="labelImageComments" runat="server"></asp:Label></div>
 
  
 
                                            </div>
 
  
 
                                        </div>
 
  
 
                                    </td>
 
  
 
                                </tr>
 
  
 
                            </table>
 
  
 
                            <br />
 
  
 
                        </div>
 
  
 
                    </td>
 
  
 
                    <td id="bg_background_right">
 
  
 
                    </td>
 
  
 
                </tr>
 
  
 
            </table>
 
  
 
        </div>
 
  
 
        <!-- body ends -->
 
  
 
        <!-- footer starts -->
 
  
 
        <div id="footer">
 
  
 
            <div style="float: right; padding-top: 3px; padding-right: 10px">
 
  
 
                <a href="http://www.xyz.com" title="xyzxyzHome">
 
  
 
                    <img src="Themes/Default/Images/Logos/logo_xyz.png" alt="xyz" border="0" /></a>
 
  
 
            </div>
 
  
 
            <div id="sub-footer">
 
  
 
                Copyright 2011. <span style="color: #ff9933; font-weight: bold">xyz</span>
 
  
 
                All Rights Reserved
 
  
 
            </div>
 
  
 
        </div>
 
  
 
        <!-- footer ends -->
 
  
 
    </div>
 
  
 
    </form>
 
  
 
</body>
 
  
 
</html>
       [Serializable()]
    private struct fileInfo
    {
        public string filename;
        public string name;
        public string keywords;
        public string comments;
    }
 
    private List<fileInfo> imagesArray
    {
        get { return (List<fileInfo>)ViewState["imagesArray"]; }
        set { ViewState["imagesArray"] = value; }
    }
 
protected void Page_Load(object sender, EventArgs e)
    {
        if (Session["objUser"] != null)
        {
            objUser = Session["objUser"] as User;
        }
        if (!IsPostBack || object.Equals(imagesArray, null))
        {
            BindSubscriptionList();
            RebindRotator();
 
               // radRotProducts.Attributes.Add("onkeyup", RadAjaxManager1.GetAjaxRequestReference(radRotProducts.
        }
         
    }
 
    protected void BindSubscriptionList()
    {
 
 
 
        imagesArray = new List<fileInfo>();
        DataTable dtAllSubscriptions = (DataTable)Session["dtAllSubscriptions"];
        foreach (string fileName in System.IO.Directory.GetFiles(Server.MapPath("~/Themes/Default/Images/Buttons/BtnProducts/"), "*.png"))
        {
            string fileN = fileName.Substring(fileName.LastIndexOf("\\") + 1);
            string appShortName = fileN.Substring(fileN.LastIndexOf("_") + 1);
            appShortName = appShortName.Substring(0, appShortName.IndexOf("."));
            string filterBySub = "ApplicationShortName ='" + appShortName + "'";
            if (dtAllSubscriptions != null)
            {
 
                DataRow[] rows = dtAllSubscriptions.Select(filterBySub);
                if (rows.Length > 0)
                {
 
                    fileInfo fInfo = new fileInfo();
                    fInfo.name = "~/Themes/Default/Images/Buttons/BtnProducts/" + fileName.Substring(fileName.LastIndexOf("\\") + 1);
                    fInfo.filename = fInfo.name;
                    fInfo.keywords = "Vitti" + fInfo.name;
                    fInfo.comments = fInfo.name + "Vitti";
                    imagesArray.Add(fInfo);
                }
            }
        }
    }
 
 
    private void RebindRotator()
    {
        DataTable rotatorData = new DataTable();
        rotatorData.Columns.Add("Image");
        rotatorData.Columns.Add("Name");
        foreach (fileInfo tempInfo in imagesArray)
        {
            rotatorData.Rows.Add(new string[] { tempInfo.filename, tempInfo.name });
        }
        radRotProducts.DataSource = rotatorData;
        radRotProducts.DataBind();
       //ConfigureRotator(radRotProducts,null);
    }
 protected void LoadProductDescription(object sender, Telerik.Web.UI.RadRotatorEventArgs e)
    {
        Telerik.Web.UI.RadRotatorItem item = e.Item;
        fileInfo fInfo = imagesArray[Convert.ToInt32(item.DataItem.ToString())];
       
        //set the image information
        labelImageComments.Text = fInfo.comments;
        labelImageKeywords.Text = fInfo.keywords;
        labelImageName.Text = fInfo.name;
 
    }   
 
protected void RadAjaxManager1_AjaxRequest(object sender, AjaxRequestEventArgs e)
    {
        
        object item=e.Argument.ToString();
      
        RadRotatorItem radRotItem=new RadRotatorItem(item);
        Telerik.Web.UI.RadRotatorEventArgs ev = new Telerik.Web.UI.RadRotatorEventArgs(radRotItem);
        LoadProductDescription(radRotProducts, ev);
     
    }

1 Answer, 1 is accepted

Sort by
0
Slav
Telerik team
answered on 19 Dec 2011, 05:26 PM
Hi Meghanath,

I tried to reproduce the described problems, using your sample code, but to no avail. You can find attached my test project. Please compare it with your actual project and check if there are differences in the setup or if I have missed something.

Note that at the current state of affairs I am mostly guessing as to what your setup is. If you are still experiencing difficulties please try modifying the attached sample so that the problem is reproducible or  prepare and send us a sample, runnable project that displays your issue so that we can examine it locally and provide a more to the point answer.

Kind regards,
Slav
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
Tags
Rotator
Asked by
Meghanath Singh
Top achievements
Rank 1
Answers by
Slav
Telerik team
Share this question
or