簡體   English   中英

Telerik + RadChart:如何在ClientSeriesClick事件上調用服務器端方法

[英]Telerik + RadChart: How to call a Server side Method on ClientSeriesClick Event

我已經實現了一個模塊,我正在使用Telerik Red條形圖。我想在現有圖表的條形圖上單擊時生成另一個條形圖,即有兩個圖形顯示在頁面加載中,第二個是詳細的圖形,單擊后顯示在第一張圖表的任何條上。在下面提到我的代碼:-

<asp:Panel ID="Panel1" runat="server">
    <telerik:radhtmlchart id="RadHtmlChart2" runat="server" width="600" height="400"
        onclientseriesclicked="OnClientSeriesClicked">
                <%-- <ClientEvents OnSeriesClick="OnSeriesClick" />--%>
                <PlotArea>
                    <Series>
                        <telerik:ColumnSeries Name="Series 1">
                            <SeriesItems>
                                <telerik:CategorySeriesItem Y="30" />
                                <telerik:CategorySeriesItem Y="10" />
                                <telerik:CategorySeriesItem Y="20" />
                            </SeriesItems>
                        </telerik:ColumnSeries>
                    </Series>
                    <XAxis>
                        <LabelsAppearance RotationAngle="33">
                        </LabelsAppearance>
                        <Items>
                            <telerik:AxisItem LabelText="Item 1" />
                            <telerik:AxisItem LabelText="Item 2" />
                            <telerik:AxisItem LabelText="Item 3" />
                        </Items>
                    </XAxis>
                </PlotArea>
            </telerik:radhtmlchart>
    <asp:Panel ID="Panel2" runat="server">
        //My Second chart Shown Here
    </asp:Panel>
</asp:Panel>

以上代碼已用於生成我的第一個圖表

我試圖填寫我的asp Panel2的第二個圖表。

protected void RadAjaxManager1_AjaxRequest(object sender, Telerik.Web.UI.AjaxRequestEventArgs e)
{
    RadHtmlChart chart = new RadHtmlChart();
    chart.ID = "chart2";
    ColumnSeries cs = new ColumnSeries();
    CategorySeriesItem csi = new CategorySeriesItem();
    cs.DataFieldY = "TOTALCALLS";

    cs.SeriesItems.Add(csi);
    chart.PlotArea.Series.Add(cs);
    Panel2.Controls.Add(chart);
}

我的Ajax電話

<telerik:radcodeblock id="RadCodeBlock1" runat="server">    
    <script>
        function getAjaxManager() {
            return $find("<%=RadAjaxManager1.ClientID%>");
        }
    </script>    
</telerik:radcodeblock>

我只想填充第二個條形圖,即我想使用客戶端seriesevent在紅色圖表中調用我的服務器端方法

通過RadAjaxManager客戶端API調用AJAX請求: http : //docs.telerik.com/devtools/aspnet-ajax/controls/ajax/client-side-programming/overview 就像是:

getAjaxManager().ajaxRequest("someOptionalArgument");

您可以在鑽取圖表演示中找到類似的代碼: http : //demos.telerik.com/aspnet-ajax/htmlchart/examples/drilldownchart/defaultcs.aspx 它更改了當前圖表的數據源,但是客戶端邏輯是相同的。

在服務器上,只需確保與其他任何服務器控件一樣,在每次后續回發時都重新創建第二個圖表。

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM