I have created an HTML chart bound to a SQL data source. Following a client-side exampleI have added an event handler which echoes the value of the bar show in the attached file.
When I click on the indicated bar an alert pops up telling me the value is "5".
What I really want is the is the X axis value, which in this case is "1920".
The purpose will then be re-direct to a different URL with this number in the query string.
function OnSeriesClick(args) {
alert("Click! Value=" + args.value);
}
<
telerik:RadHtmlChart
runat
=
"server"
ID
=
"RadHtmlChart1"
DataSourceID
=
"SqlDataSource1"
Width
=
"660px"
>
<
ClientEvents
OnSeriesClick
=
"OnSeriesClick"
OnLegendItemClick
=
"OnLegendItemClick"
/>
<
PlotArea
>
<
CommonTooltipsAppearance
Shared
=
"true"
>
<
SharedTemplate
>
<
div
>Composed in decade beginning #= category #</
div
>
# for (var i = 0; i <
points.length
; i++) { #
<div>#: points[i].series.name#: #: points[i].value #</
div
>
# } #
</
SharedTemplate
>
</
CommonTooltipsAppearance
>
<
Series
>
<
telerik:ColumnSeries
DataFieldY
=
"songs"
Name
=
"Songs"
>
</
telerik:ColumnSeries
>
</
Series
>
<
XAxis
DataLabelsField
=
"date_range"
>
<
LabelsAppearance
RotationAngle
=
"75"
/>
<
TitleAppearance
Text
=
"Decade"
/>
<
MajorGridLines
Visible
=
"false"
></
MajorGridLines
>
<
MinorGridLines
Visible
=
"false"
></
MinorGridLines
>
</
XAxis
>
<
YAxis
>
<%-- <
TitleAppearance
Text
=
"Count"
/>--%>
<
MajorGridLines
Visible
=
"true"
Color
=
"#ffc5bf"
Width
=
"1"
></
MajorGridLines
>
<
MinorGridLines
visible
=
"false"
></
MinorGridLines
>
</
YAxis
>
</
PlotArea
>
<
Legend
>
<
Appearance
Visible
=
"false"
/>
</
Legend
>
<
ChartTitle
Text
=
"Songs by Decade"
>
<
Appearance
BackgroundColor
=
"White"
Visible
=
"True"
>
</
Appearance
>
</
ChartTitle
>
</
telerik:RadHtmlChart
>
<
div
class
=
"admin_activity_toolbar"
>
<
telerik:RadToolBar
ID
=
"ToolBar"
Runat
=
"server"
OnButtonClick
=
"ToolBar_ButtonClick"
Orientation
=
"Vertical"
Width
=
"120px"
>
<
Items
>
<
telerik:RadToolBarButton
runat
=
"server"
Text
=
"Done"
Value
=
"done"
>
</
telerik:RadToolBarButton
>
<
telerik:RadToolBarButton
runat
=
"server"
Text
=
"Button 2"
IsSeparator
=
"True"
>
</
telerik:RadToolBarButton
>
<
telerik:RadToolBarButton
runat
=
"server"
Text
=
"Pivot"
Value
=
"pivot"
Enabled
=
"False"
>
</
telerik:RadToolBarButton
>
</
Items
>
</
telerik:RadToolBar
>