Multiple Pointers on RadLinearGauge - Pointer Values Gone After Postback

2 posts, 0 answers
  1. Gary
    Gary avatar
    1 posts
    Member since:
    May 2016

    Posted 17 May Link to this post

    Hi. I can't figure this one out.

    I recently upgraded to Ajax UI 2016.2.504.45 specifically so I could make use of the new Multiple Pointers feature. I updated my controls and code to add multiple pointers dynamically, rather than just setting the value of the single pointer dynamically. And this works great. 

    My issue is that after postback the gauge loads and my pointers have been removed. However the Scale ranges that I am adding dynamically are retained and correct. 

    I run a number of intense calculations on a button click which populates the RadLinearGauge with pointers, I don't want to have to run this on every postback just to ensure that the pointers are present. The only thing I can think is that this is a bug in the RadLinearGauge.

    Reproducible Example: 

    HTML

    01.<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="Default" %>
    02. 
    03.<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    04. 
    06.<head runat="server">
    07.    <title></title>
    08.    <telerik:RadStyleSheetManager ID="RadStyleSheetManager1" runat="server" />
    09.</head>
    10.<body>
    11.    <form id="form1" runat="server">
    12.        <telerik:RadScriptManager ID="RadScriptManager1" runat="server">
    13.            <Scripts>
    14.                <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.Core.js" />
    15.                <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQuery.js" />
    16.                <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQueryInclude.js" />
    17.            </Scripts>
    18.        </telerik:RadScriptManager>
    19.        <script type="text/javascript">
    20.            //Put your JavaScript code here.
    21.        </script>
    22.        <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
    23.        </telerik:RadAjaxManager>
    24.        <div>
    25.            <telerik:RadLinearGauge ID="SealingValue" runat="server" Width="410px">
    26.                <Scale Vertical="false" MajorUnit="50" />
    27.            </telerik:RadLinearGauge>
    28.        </div>
    29.        <div>
    30.            <asp:Button ID="btnPostBack" runat="server" OnClick="btnPostBack_Click" Text="Postback" />
    31.        </div>
    32.    </form>
    33.</body>
    34.</html>

    C#
    01.using System;
    02.using System.Web;
    03.using System.Web.UI;
    04.using System.Web.UI.WebControls;
    05.using System.Data;
    06.using System.Configuration;
    07.using System.Web.Security;
    08.using System.Web.UI.WebControls.WebParts;
    09.using System.Web.UI.HtmlControls;
    10.using Telerik.Web.UI;
    11. 
    12.public partial class Default : System.Web.UI.Page
    13.{
    14.    protected void Page_Load(object sender, EventArgs e)
    15.    {
    16.        if (!Page.IsPostBack)
    17.        {
    18.            GaugeRange range1 = new GaugeRange();
    19.            range1.From = 0;
    20.            range1.To = 25;
    21.            range1.Color = System.Drawing.Color.FromName("Green");
    22. 
    23.            GaugeRange range2 = new GaugeRange();
    24.            range2.From = 25;
    25.            range2.To = 75;
    26.            range2.Color = System.Drawing.Color.FromName("Blue");
    27. 
    28.            GaugeRange range3 = new GaugeRange();
    29.            range3.From = 75;
    30.            range3.To = 100;
    31.            range3.Color = System.Drawing.Color.FromName("Yellow");
    32. 
    33.            SealingValue.Scale.Ranges.Add(range1);
    34.            SealingValue.Scale.Ranges.Add(range2);
    35.            SealingValue.Scale.Ranges.Add(range3);
    36. 
    37.            LinearPointer pointer1 = new LinearPointer();
    38. 
    39.            pointer1.Value = 30;
    40.            pointer1.Shape = Telerik.Web.UI.Gauge.PointerShape.Arrow;
    41.            pointer1.Size = 13;
    42.            pointer1.Color = System.Drawing.Color.FromName("White");
    43. 
    44.            LinearPointer pointer2 = new LinearPointer();
    45. 
    46.            pointer2.Value = 90;
    47.            pointer2.Shape = Telerik.Web.UI.Gauge.PointerShape.Arrow;
    48.            pointer2.Size = 13;
    49.            pointer2.Color = System.Drawing.Color.FromName("Red");
    50. 
    51.            SealingValue.Pointers.Add(pointer1);
    52.            SealingValue.Pointers.Add(pointer2);
    53.        }
    54.    }
    55. 
    56.    protected void btnPostBack_Click(object sender, EventArgs e)
    57.    {
    58.         
    59.    }
    60.}

  2. Marin Bratanov
    Admin
    Marin Bratanov avatar
    3602 posts

    Posted 20 May Link to this post

    Hello Gary,

    Multiple pointers persistence in the ViewState is not implemented in the Gauge control at the moment. For the 1.5 years since this feature has been available this is the first time such a request is received.

    Thus, what I can suggest is the following:

    • recreate the pointers with each postback
    • OR, create them once and store their settings/objects in the ViewState so you can recrete them from there, instead of perform all the actual calculations each time

    If you would like to see such persistence built-in the Gauge control, I suggest you post your feature request in our feedback portal: http://feedback.telerik.com/project/108. The popularity of the idea will determine how soon and if it will be implemented.

    Regards,

    Marin Bratanov
    Telerik
    Do you need help with upgrading your ASP.NET AJAX, WPF or WinForms projects? Check the Telerik API Analyzer and share your thoughts.
  3. UI for ASP.NET Ajax is Ready for VS 2017
Back to Top