RadRotator issues with controlbuttons, ajaxpanel,etc

2 posts, 0 answers
  1. Meghanath Singh
    Meghanath Singh avatar
    5 posts
    Member since:
    Jun 2008

    Posted 15 Dec 2011 Link to this post

    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);
         
        }
  2.
  3. Slav
    Admin
    Slav avatar
    1359 posts

    Posted 19 Dec 2011 Link to this post

    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
Back to Top