Browser closes connection before receiving response from OnSeriesItemClicked

6 posts, 0 answers
  1. Michael
    Michael avatar
    11 posts
    Member since:
    Oct 2012

    Posted 12 Aug 2013 Link to this post

    Hello Telerik support team,

    I have a RadHTMLChart that will eventually need to perform a drill-down. Following the documentation examples I created a sample application to try and sent a request to the server for the next set of line series to be drawn on the chart.

    The server receives the request and goes through all the appropriate code-behind without errors, however the browser closes the connection between it and the server before it receives the response from the server. The result from the user's perspective is that the graph does not change.

    This was tested on the latest versions of FF, IE, GC
    <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="SeriesClickedIndependant.aspx.cs"
        Inherits="SeriesClicked.SeriesClickedIndependant" %>
     
    <%@ 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 runat="server">
        <title></title>
    </head>
    <body>
        <form id="form1" runat="server">
        <div>
            <telerik:RadScriptManager ID="RadScriptManager1" runat="server">
            </telerik:RadScriptManager>
            <telerik:RadAjaxManager ID="RadAjaxManager1" OnAjaxRequest="RadAjaxManager1_AjaxRequest" runat="server">
            </telerik:RadAjaxManager>
            <telerik:RadHtmlChart ID="RadHtmlChart1" OnClientSeriesClicked="OnClientSeriesClicked" runat="server">
            </telerik:RadHtmlChart>
            <script type="text/javascript">
                function OnClientSeriesClicked(sender, eventArgs) {
                    //alert("You clicked on a series item with value '" + eventArgs.get_value() + "' from category '" + eventArgs.get_category() + " and Series:" + eventArgs.get_seriesName() + '.');
                    $find("<%= RadAjaxManager1.ClientID %>").ajaxRequest(eventArgs.get_seriesName());
     
                }
            </script>
        </div>
        </form>
    </body>
    </html>


    using System;
    using System.Collections.Generic;
    using System.Linq;
    using System.Web;
    using System.Web.UI;
    using System.Web.UI.WebControls;
    using Reports.ReportPresenter;
    using Telerik.Web.UI;
     
    namespace SeriesClicked
    {
        public partial class SeriesClickedIndependant : System.Web.UI.Page
        {
            private ReportsDataSource _radDataSource;
            protected void Page_Load(object sender, EventArgs e)
            {
                if (!IsPostBack)
                {
                    PreFetch();
                    FetchData(ReportsStoredProcedures.StoredProcedures.Company, new ReportsParameters(1356, "01/01/2011", "05/30/2011"));
                    PostFetch();
                }
            }
     
            public void FetchData(ReportsStoredProcedures.StoredProcedures storedProcedure, ReportsParameters parameters)
            {
                //Populates the DataSource that will be used by the RADHTMLChart
                _radDataSource = new ReportsPresenter().GetReportsDataSource(storedProcedure, parameters);
            }
     
            public void PostFetch()
            {
                foreach (LineSeries lS in _radDataSource.ReportsRadHtmlSource.SeriesCollection)
                {
                    RadHtmlChart1.PlotArea.Series.Add(lS);
                }
     
                foreach (string s in _radDataSource.ReportsRadHtmlSource.LabelsArray)
                {
                    RadHtmlChart1.PlotArea.XAxis.Items.Add(s);
                }
            }
     
            public void PreFetch()
            {
                RadHtmlChart1.PlotArea.Series.Clear();
            }
     
     
     
            protected void RadAjaxManager1_AjaxRequest(object sender, AjaxRequestEventArgs e)
            {
                PreFetch();
                FetchData(ReportsStoredProcedures.StoredProcedures.Region, new ReportsParameters(1356, 1356, 0, Reports.DataAccess.Facility.FacilityType.Regional, "01/01/2011", "05/30/2011"));
                PostFetch();
            }
     
     
            public void FetchData()
            {
            }
        }
    }
  2. Danail Vasilev
    Admin
    Danail Vasilev avatar
    1490 posts

    Posted 14 Aug 2013 Link to this post

    Hello Michael,

    The settings of the RadAjaxManager are not set, so that there aren't any controls which trigger the partial update and controls which are to be updated. You can try modifying the RadAjaxManager declaration as follows:
    <telerik:RadAjaxManager ID="RadAjaxManager1" OnAjaxRequest="RadAjaxManager1_AjaxRequest" runat="server">
        <AjaxSettings>
            <telerik:AjaxSetting AjaxControlID="RadAjaxManager1">
                <UpdatedControls>
                    <telerik:AjaxUpdatedControl ControlID="RadHtmlChart1"></telerik:AjaxUpdatedControl>
                </UpdatedControls>
            </telerik:AjaxSetting>
        </AjaxSettings>
    </telerik:RadAjaxManager>
    <telerik:RadHtmlChart ID="RadHtmlChart1" OnClientSeriesClicked="OnClientSeriesClicked" runat="server">
    </telerik:RadHtmlChart>

    You can also find useful RadAjax - Telerik's ASP.NET Ajax online demo and RadAjaxManager help article that shed more light on how to configure the RadAjaxManager.

    Regards,
    Danail Vasilev
    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.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Michael
    Michael avatar
    11 posts
    Member since:
    Oct 2012

    Posted 14 Aug 2013 Link to this post

    I tried filling out all the settings for the RadAjaxManager but then I got an Error that said

    The Controls collection cannot be modified because the control contains code blocks (i.e. <% ... %>)


    I figured that the issue was because of the code blocks in the $find() function, I remoced the code block symbols and FireBug started yelling that TypeError: $find(...) is null.
  5. Danail Vasilev
    Admin
    Danail Vasilev avatar
    1490 posts

    Posted 15 Aug 2013 Link to this post

    Hi Michael,

    In order to prevent this kind of error, caused when there are code blocks placed within the markup, you can use the RadCodeBlock control. For example:
    <telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">
        <script type="text/javascript">
            function AjaxReq(args) {
                $find("<%= RadAjaxPanel1.ClientID %>").ajaxRequestWithTarget("<%= Button1.UniqueID %>", '');
            }
        </script>
    </telerik:RadCodeBlock>

    More information on the matter is available in RadCodeBlock and RadScriptBlock help article.

    Should you need further assistance on this regard, do not hesitate to contact us again.

    Regards,
    Danail Vasilev
    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.
  6. Michael
    Michael avatar
    11 posts
    Member since:
    Oct 2012

    Posted 15 Aug 2013 Link to this post

    Thanks for the help. Code worked and everything. I'm moving on now to trying to to the same thing as I did in this sample application, but instead having the page be the child of a master page. I'm having issues right now where it's complaining that RadAjaxmanager1 does not exist.

    <%@ Page Title="" Language="C#" MasterPageFile="~/SeriesClickedMaster.Master" AutoEventWireup="true"
        CodeBehind="SeriesClickedChildPage.aspx.cs" Inherits="SeriesClicked.SeriesClickedChildPage" %>
     
    <%@ MasterType VirtualPath="~/SeriesClickedMaster.Master" %>
    <%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
    <asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
    </asp:Content>
    <asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
        <telerik:RadScriptManager ID="RadScriptManager1" runat="server">
        </telerik:RadScriptManager>
        <telerik:RadAjaxManagerProxy id="RadAjaxManagerProxy1" runat="server">
            <AjaxSettings>
                <telerik:AjaxSetting AjaxControlID="RadScriptManager1">
                    <UpdatedControls>
                        <telerik:AjaxUpdatedControl ControlID="RadHtmlChart1" />
                    </UpdatedControls>
                </telerik:AjaxSetting>
            </AjaxSettings>
        </telerik:RadAjaxManagerProxy>
        <script type="text/javascript">
            function OnClientSeriesClicked(sender, eventArgs) {
                $find("<%= RadAjaxManager1.GetCurrent(Page).ClientID %>").ajaxRequest(eventArgs.get_seriesName());
     
            }
        </script>
        <telerik:RadHtmlChart ID="RadHtmlChart1" OnClientSeriesClicked="OnClientSeriesClicked"
            runat="server">
        </telerik:RadHtmlChart>
    </asp:Content>
  7. Michael
    Michael avatar
    11 posts
    Member since:
    Oct 2012

    Posted 16 Aug 2013 Link to this post

    Never mind, I figured it out.
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017