KoolReport's Forum

Official Support Area, Q&As, Discussions, Suggestions and Bug reports.
Forum's Guidelines

Want to run ajax on click of chart #617

Open Bharani opened this topic on on Jan 25, 2019 - 4 comments

Bharani commented on Jan 25, 2019

I want to show additional data related to selected chart portion at the bottom of the chart. I am using ajax but I am not able to trigger click event on the chart.

I am using codeigniter and using koolreport Instant package

    Widget::create(PieChart::class,array(
        "dataSource"=>array(
            array("name"=>"Peter","age"=>35),
            array("name"=>"Karl","age"=>32),
        )
    ));

I have tried this javascript code but not working. Giving an error of undefined google



      var chart = new google.visualization.PieChart(document.getElementById('chart_div'));
    
      function selectHandler() 

        {
    
          console.log("clicked");
        
          var selectedItem = chart.getSelection()[0];
    
          if (selectedItem) 
          {
          var topping = data.getValue(selectedItem.row, 0);
          alert('The user selected ' + topping);
          }
        } 
    
        google.visualization.events.addListener(chart, 'select', selectHandler);
        chart.draw(data, options);
KoolReport commented on Jan 25, 2019

In the latest version of KoolReport, you do not need to use instant/Widget, you can just use:

PieChart::create([
    "dataSource"=>array(...)
]);

Secondly for the event, you do this:

PieChart::create([
    "clientEvents"=>[
        "itemSelect"=>"function(params){
            console.log(params);
        }"
    ]
]);

Please refer to this documentation of Google Charts

Hope that helps.

Bharani commented on Jan 25, 2019

Thanks, for the solution.

I have install the latest version of koolreport and write the code as you suggested but getting an 403 error for KoolReport.js.

Please help.

Bharani commented on Jan 25, 2019

Any suggestion

KoolReport commented on Jan 26, 2019

It is because KoolReport is put inside folder which is inaccessible. So there are two solution:

  1. you can move the koolreport folder to accessible place such as in the same folder with your index.php (top level folder)
  2. you can use the codeigniter package and use the friendship between report and codeigniter. This will help to export resources to public place( in assets folder)

I recommend the second choice.

Please let me know.

Build Your Excellent Data Report

Let KoolReport help you to make great reports. It's free & open-source released under MIT license.

Download KoolReport View demo
None yet

None