Trouble with Codeigniter + AR + Highcharts

Question

Mario A._1 0 Newbie Poster

7 Years Ago

I´m in disgrace with the framework Codeigniter version 2.2.0, it only displays the json response, no errors, no chart...

Code

**Model**
function get_pata()

        {
            $this->db->select('theyear, cantidad_alumnos, rawkw, rawkwxgei');
            $this->db->from('pdc_factor_gei');
            $query = $this->db->get();
            return $query->result();

}

**Controller to handle data from Model and display in view;**

    function data_fik()
{
    $data = $this->modelo_factor_gei->get_pata();

    $category = array();
    $category['name'] = 'Periodo';

    $series1 = array();
    $series1['name'] = 'Cantidad de Alumnos';

    $series2 = array();
    $series2['name'] = 'Consumo Kw por Temporada';

    $series3 = array();
    $series3['name'] = 'Factor GEI';

    foreach ($data as $row)
    {
        $category['data'][] = $row->theyear;
        $series1['data'][] = $row->cantidad_alumnos;
        $series2['data'][] = $row->rawkw;
        $series3['data'][] = $row->rawkwxgei;
    }

    $result = array();
    array_push($result,$category);
    array_push($result,$series1);
    array_push($result,$series2);
    array_push($result,$series3);

    print json_encode($result, JSON_NUMERIC_CHECK);

    $data['body'] = 'hchart_elec';
    $this->load->view('main', $data);

}

**View:**

    <!DOCTYPE HTML> <html> <head> Here we go <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <script type="text/javascript">
////////Graficas ////////////////////
$(document).ready(function() 
{
  var options =
  {
          chart:
          {
              renderTo: 'container',
              type: 'column',
              marginRight: 130,
              marginBottom: 25
          },
          title:
          {
              text: 'KKKKSAMM',
              x: -20 //center
          },
          subtitle:
          {
              text: '',
              x: -20
          },
          xAxis:
          {
              categories: []
          },
          yAxis:
          {
              title:
              {
                  text: 'LSKDLS'
              },
              plotLines: 
              [{
                  value: 0,
                  width: 1,
                  color: '#808080'
              }]
          },
          tooltip:
          {
              formatter: function()
              {
                return '<b>'+ this.series.name +'</b><br/>' + this.x +': '+ this.y;
              }
          },
          legend:
          {
              layout: 'vertical',
              align: 'right',
              verticalAlign: 'top',
              x: -10,
              y: 100,
              borderWidth: 0
          },

          series: []
 }

      $.getJSON("<?php echo site_url('/control_factor_gei/data_fik');?>", function(json)
      {
        options.xAxis.categories = json[0]['data'];
        options.series[0] = json[1];
        options.series[1] = json[2];
        options.series[2] = json[3];
        chart = new Highcharts.Chart(options);
      });
  });

</script> </head> <body> <div id="container" style="min-width: 600px; height: 480px; margin: 0 auto"></div> </body>

**Response:**

[{"name":"Periodo","data":[2011,2012,2013,2014,2015,2016]},{"name":"Cantidad de Alumnos","data":[178745,180593,184257,188657,192176,193651]},{"name":"Consumo Kw por Temporada","data":[88972200,89414600,85017100,88017900,91786900,24221200]},{"name":"Factor GEI","data":[44503900,45485200,43248200,44220200,46609400,12318900]}]

I´m no expert in CI or php, so still learning, any help is welcome.

codeigniter javascript jquery mysql php

Edited 7 Years Ago by Mario A._1 because: Add info

2 Contributors
5 Replies
368 Views
2 Days Discussion Span
Latest Post 7 Years Ago Latest Post by Mario A._1

All 5 Replies

cereal 1,524 Nearly a Senior Poster

7 Years Ago

Hi,

in your method controller data_fik() replace this:

print json_encode($result, JSON_NUMERIC_CHECK);
$data['body'] = 'hchart_elec';
$this->load->view('main', $data);

with:

header('Content-Type: application/json; charset=utf8');
echo json_encode($result, JSON_NUMERIC_CHECK);

You don't neet to load a view, because the method will return JSON content, so just set the correct content type header and print it.

And it should work, you can also test what is received by getJSON() through console.log():

console.log(json);

You can also manually open the data_fik link to see if the headers and the contents are correct, the developer console in Google Chrome or extensions like Postman should help you in the debug process.

Bye.

cereal 1,524 Nearly a Senior Poster

7 Years Ago

@Mario no problem. The blank page can be caused by a PHP error, check the PHP error log or the log file created by CodeIgniter, it should be in ./application/logs/ and his verbosity can be set through the ./application/config/config.php file, also see if the index.php page has the error_reporting() enabled.

About the view

You are correct but, the view must be set by another method, and you should use the data_fik() method to get only the JSON response. In your view file you have this line:

$.getJSON("<?php echo site_url('/control_factor_gei/data_fik');?>",

which is requesting the JSON data from the data_fik method, so the view cannot generate by the same method (unless you set a query parameter like data_fik?get=source and data_fik?get=json and set some conditional statements to manage those parameters), but if this is not necessary you can write something like this:

public function data_fik()
{
    # query
    # set header
    # print JSON response
}

public function data_view()
{
    # set the view here
}

Then, when you want to access the page, open /control_factor_gei/data_view. Is this more clear now? If you have doubts let us know.

//
@upvoter, thanks for the vote on the duplicate post, made my day lol :D

Reply to this topic

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.

Mario A._1 0 Newbie Poster · Answer 1 · 2016-09-29T22:05:00+00:00

@cereal If replacing the code with your given suggestion, displays a blank page, for project reasons, view and body must be displayed, aslo the console.log thingy can´t figure where to add, sorry I´m completely naive in this field.

cereal 1,524 Nearly a Senior Poster Featured Poster · Answer 2 · 2016-09-30T16:17:28+00:00

Addition:

I forgot CI ships with an Output class, which is loaded by default, so you can also send JSON data in this style:

$this->output
     ->set_header('HTTP/1.1 200 OK')
     ->set_content_type('application/json', 'utf-8')
     ->set_output(json_encode($result, JSON_NUMERIC_CHECK));

For more info see: http://www.codeigniter.com/userguide2/libraries/output.html

Mario A._1 0 Newbie Poster · Answer 3 · 2016-09-30T20:32:36+00:00

Mario A._1 0 Newbie Poster

7 Years Ago

@celereal I´m gonna try your suggestions, thanks for your help.

Edited 7 Years Ago by Mario A._1 because: kudos

Trouble with Codeigniter + AR + Highcharts

Recommended Answers Collapse Answers

All 5 Replies

Recommended Answers