Fire Server Side Events

Mar 4, 2012 at 2:56 PM

Hi team,

I´m new in highcharts dot net, It is posible to fire a server event from highcharts?. Actually the events works in client side but server site. I means.. something like this:

        protected void Page_Load(object sender, EventArgs e)
        {

            //add click event handler
            myPieChartGraph.PlotOptions.point.events.Click += new EventHandler(events_Click);
        }

        public void events_Click(object sender, EventArgs e)
        {
            //do somethig else with the point clicked
        }

I tried to do this:

myPieChartGraph.PlotOptions.point.events.click = "javascript:__doPostBack('myPieChartGraph',this.y)"; and it fires the event to the server but i don´t know how to add handler method.

Could you help me please? any ideas would be helpful. Thnks!!

Developer
Mar 6, 2012 at 5:03 AM
Edited Mar 6, 2012 at 5:03 AM

You can find a good explanation of it here [wiki.asp.net] and here [aspalliance.com]

Basically, you need to perform the following steps:

  1. Ensure that your page has the two hidden fields, __EVENTTARGET and __EVENTARGUMENT which are used by asp.net to decide which postback event to call, and with what parameters.
  2. Add the javascript mentioned below under the Head tag :
    function __doPostBack(eventTarget, eventArgument) {
        document.Form1.__EVENTTARGET.value = eventTarget;
        document.Form1.__EVENTARGUMENT.value = eventArgument;
        document.Form1.submit();
    }
  3. At the top of the codebehind, you need to add the following code to handle this 'postback' :
    if (Request.Form["__EVENTTARGET"] == "Point_Click")
    {
        //fire event
        Point_Click(this, new EventArgs());
    }

That should do it for you. Let us know if you face any problems.

Regards,

Rahul

Developer
Mar 6, 2012 at 5:13 AM

Actually, a better solution would be the following:

  1. Add the following code to the point's javascript click event
    __doPostBack("<%=Page.ClientID %>", 'tab1');
  2. Inherit your page class from Page as well as the IPostbackHandler interface
  3. Add the following code somwehere in your codebehind to implement the interface as well as handle the postback : 
    public void RaisePostBackEvent(string eventArgument)
    {
        switch (eventArgument)
        {
            case "Point_Click":
                CsharpFunction();
                break;
         }
    }

I think this should be cleaner to deal with..

Regards,

Rahul

May 31, 2013 at 4:09 AM
hi,

Can I know how can I define the event "Point_Click" at the highchart. I though that the only way we could declare it is using ( myPieChartGraph.PlotOptions.point.events.Click).
Can you show me how can I define it for the highchart so that I may know how can I control it with the eventHandler.

Thank You.
Jul 4, 2013 at 3:31 PM
Hi Rahul
Could you please post an example of defining the event "Point_Click" at the highchart and then catching the event with
public void RaisePostBackEvent(string eventArgument)
{
switch (eventArgument)
{
    case "Point_Click":
        CsharpFunction();
        break;
 }
}
I tried your solution but,I might be doing wrong with defining the event "Point_Click" at the highchart and also the page reloads when clicked on the pie slice. is there way that when i click on the pie slice it will call a c# sharp function as you described above to feed a column chart on the same page with out page reloading?

An Example will be very good to understand .Thanks in Advance

Regards
Ram