I have an ASP.Net web page that contains a RadChart that is bound to a database with an sqldatasouce. When an area of the chart is clicked, it opens a popup window with a radgrid populated with data from a stored procedure that fires after one click but takes an extra click in order to populate this grid. I am kind of new to the Web page life cycle and I believe that is where my issue lies but I an having trouble figuring this one out. My C# code for the page is as follows:
ASPX Code:
using
System;
using
System.Data;
using
System.Web;
using
System.Web.UI;
using
System.Web.UI.WebControls;
using
Telerik.Charting;
using
Telerik.Web.UI;
using
VapmData;
using
VapmLib;
namespace
CPSUI.CMS
{
public
partial
class
ACPMSDashboard : System.Web.UI.Page
{
string
EDI_TYPE;
protected
void
Page_Load(
object
sender, EventArgs e)
{
if
(!IsPostBack)
{
}
}
protected
void
EDITypeChart_Click(
object
sender, ChartClickEventArgs args)
{
string
EDI_TYPE = args.SeriesItem.Name;
GetChartData(EDI_TYPE);
}
protected
void
EDITypeChart_ItemDataBound(
object
sender, ChartItemDataBoundEventArgs e)
{
//EDI_TYPE = e.SeriesItem.Name;
//EDI_TYPE = Convert.ToString(EDI_TYPE[EDI_TYPE.Length - 1]);
//EDITypeChart.Attributes["href"] = "#";
//EDITypeChart.Attributes["onClick"] = string.Format("return openEDIDetail('{0}');", EDI_TYPE);
}
public
void
GetChartData(
string
EDI_TYPE)
{
EDI_TYPE = Convert.ToString(EDI_TYPE[EDI_TYPE.Length - 1]);
EDITypeChart.Attributes[
"href"
] =
"#"
;
EDITypeChart.Attributes[
"onClick"
] =
string
.Format(
"return openEDIDetail('{0}');"
, EDI_TYPE);
}
}
}
ASPX Code:
<
asp:Content
ID
=
"Content5"
ContentPlaceHolderID
=
"contentPH"
runat
=
"server"
>
<
telerik:RadAjaxManager
ID
=
"RadAjaxManager1"
runat
=
"server"
>
<
AjaxSettings
>
<
telerik:AjaxSetting
AjaxControlID
=
"EDITypeChart"
>
<
UpdatedControls
>
<
telerik:AjaxUpdatedControl
ControlID
=
"EDITypeChart"
LoadingPanelID
=
"LoadingPanel1"
/>
</
UpdatedControls
>
</
telerik:AjaxSetting
>
<
telerik:AjaxSetting
AjaxControlID
=
"Refresh"
>
<
UpdatedControls
>
<
telerik:AjaxUpdatedControl
ControlID
=
"EDITypeChart"
>
</
telerik:AjaxUpdatedControl
>
<
telerik:AjaxUpdatedControl
ControlID
=
"Refresh"
></
telerik:AjaxUpdatedControl
>
</
UpdatedControls
>
</
telerik:AjaxSetting
>
</
AjaxSettings
>
</
telerik:RadAjaxManager
>
<
telerik:RadCodeBlock
ID
=
"RadCodeBlock1"
runat
=
"server"
>
<
script
type
=
"text/javascript"
>
function openEDIDetail(EDI_TYPE) {
window.open("/CMS/EDIRadChartDetail.aspx?EDI_TYPE=" + EDI_TYPE + "&Index=0", "EDIRadChartDetail", "width=700px, height=400px, resizable=1, scrollbars=1");
}
</
script
>
</
telerik:RadCodeBlock
>
<
div
class
=
"metrics-container"
>
<
asp:Panel
ID
=
"Panel4"
runat
=
"server"
BorderStyle
=
"None"
>
<
telerik:RadChart
ID
=
"EDITypeChart"
runat
=
"server"
ChartImageFormat
=
"Jpeg"
Skin
=
"Telerik"
onclick
=
"EDITypeChart_Click"
Width
=
"246px"
Height
=
"242px"
DataSourceID
=
"SqlDataSource1"
DefaultType
=
"Pie"
onitemdatabound
=
"EDITypeChart_ItemDataBound"
>
<
Appearance
Corners
=
"Round, Round, Round, Round, 7"
>
<
FillStyle
FillType
=
"ComplexGradient"
>
<
FillSettings
GradientMode
=
"Horizontal"
>
<
ComplexGradient
>
<
telerik:GradientElement
Color
=
"236, 236, 236"
/>
<
telerik:GradientElement
Color
=
"248, 248, 248"
Position
=
"0.5"
/>
<
telerik:GradientElement
Color
=
"236, 236, 236"
Position
=
"1"
/>
</
ComplexGradient
>
</
FillSettings
>
</
FillStyle
>
<
Border
Color
=
"130, 130, 130"
/>
</
Appearance
>
<
Series
>
<
telerik:ChartSeries
DataLabelsColumn
=
"EDI_TYPE"
DataYColumn
=
"NUM_EDI_TYPE"
Name
=
"NUM_EDI_TYPE"
Type
=
"Pie"
>
<
Appearance
>
<
FillStyle
FillType
=
"ComplexGradient"
>
<
FillSettings
>
<
ComplexGradient
>
<
telerik:GradientElement
Color
=
"213, 247, 255"
/>
<
telerik:GradientElement
Color
=
"193, 239, 252"
Position
=
"0.5"
/>
<
telerik:GradientElement
Color
=
"157, 217, 238"
Position
=
"1"
/>
</
ComplexGradient
>
</
FillSettings
>
</
FillStyle
>
<
TextAppearance
TextProperties-Color
=
"51, 51, 51"
>
</
TextAppearance
>
</
Appearance
>
</
telerik:ChartSeries
>
</
Series
>
<
Legend
Visible
=
"False"
>
<
Appearance
Visible
=
"False"
Dimensions-Margins
=
"17.6%, 3%, 1px, 1px"
Position-AlignedPosition
=
"TopRight"
Dimensions-Paddings
=
"2px, 8px, 6px, 3px"
>
<
ItemMarkerAppearance
Figure
=
"Square"
>
<
Border
Width
=
"0"
/>
</
ItemMarkerAppearance
>
<
FillStyle
MainColor
=
""
>
</
FillStyle
>
<
Border
Width
=
"0"
/>
</
Appearance
>
</
Legend
>
<
PlotArea
>
<
DataTable
>
<
Appearance
>
<
Border
Width
=
"3"
/>
</
Appearance
>
</
DataTable
>
<
XAxis
AutoScale
=
"False"
DataLabelsColumn
=
"EDI_TYPE"
MaxValue
=
"2"
MinValue
=
"1"
Step
=
"1"
>
<
Appearance
Color
=
"182, 182, 182"
MajorTick-Color
=
"216, 216, 216"
>
<
MajorGridLines
Color
=
"216, 216, 216"
PenStyle
=
"Solid"
/>
<
TextAppearance
TextProperties-Color
=
"51, 51, 51"
>
</
TextAppearance
>
</
Appearance
>
<
AxisLabel
>
<
TextBlock
Text
=
"Y Axis"
>
<
Appearance
TextProperties-Color
=
"51, 51, 51"
>
</
Appearance
>
</
TextBlock
>
</
AxisLabel
>
<
Items
>
<
telerik:ChartAxisItem
Value
=
"1"
>
</
telerik:ChartAxisItem
>
<
telerik:ChartAxisItem
Value
=
"2"
>
</
telerik:ChartAxisItem
>
</
Items
>
</
XAxis
>
<
YAxis
>
<
Appearance
Color
=
"182, 182, 182"
MajorTick-Color
=
"216, 216, 216"
MinorTick-Color
=
"223, 223, 223"
>
<
MajorGridLines
Color
=
"216, 216, 216"
/>
<
MinorGridLines
Color
=
"223, 223, 223"
/>
<
TextAppearance
TextProperties-Color
=
"51, 51, 51"
>
</
TextAppearance
>
</
Appearance
>
<
AxisLabel
>
<
TextBlock
>
<
Appearance
TextProperties-Color
=
"51, 51, 51"
>
</
Appearance
>
</
TextBlock
>
</
AxisLabel
>
</
YAxis
>
<
Appearance
>
<
FillStyle
MainColor
=
"White"
FillType
=
"Solid"
>
</
FillStyle
>
<
Border
Color
=
"182, 182, 182"
/>
</
Appearance
>
</
PlotArea
>
<
ChartTitle
>
<
Appearance
>
<
FillStyle
MainColor
=
""
>
</
FillStyle
>
</
Appearance
>
<
TextBlock
Text
=
"Inbound 837s"
>
<
Appearance
TextProperties-Color
=
"72, 174, 40"
TextProperties-Font
=
"Arial, 18pt"
>
</
Appearance
>
</
TextBlock
>
</
ChartTitle
>
</
telerik:RadChart
>
</
asp:Panel
>