title: Uncaught ReferenceError: year is not defined in google chart using ajax/codeigniter
body: <p>Good day. I want to make my column char working with database but I got this error says <em>"Uncaught ReferenceError: year is not defined"</em>. here is my code.</p>
  
  <p><strong>JAVASCRIPT</strong></p>
  
  <pre><code>function year()
  {
    var e = document.getElementById("selectyear");
  var year = e.options[e.selectedIndex].text;
  
  
    //Ajax Load data from ajax
          $.ajax({
             url : "&lt;?php echo site_url('chartcontroller/chart/')?&gt;/" + year,
             type: "GET",
             dataType: "JSON",
             success: function(data)
              {
  
                drawChart1(data);
           },
          error: function (jqXHR, textStatus, errorThrown)
          {
              alert('Error get data from ajax');
          }
          });
  
  }
      google.load("visualization", "1", {packages:["corechart"]});
  google.setOnLoadCallback(drawChart1);
  function drawChart1(data) {
  
      var data = google.visualization.arrayToDataTable([
            ['Courses', 'S.Y. 2011-2012', 'S.Y. 2012-2013','S.Y. 2013-2014'],
  
     for(var i = 1; i &lt; data.length; i++) {
                  comment = data[i];
                [comment.Course, comment.year_a, comment.year_b, comment.year_c],
              }
          ]);
  
  
    var options = {
      title: 'ColumnChart',
      hAxis: {title: 'Courses', titleTextStyle: {color: 'blue'}}
  
   };
  
  var chart = new google.visualization.ColumnChart(document.getElementById('chart_div1'));
    chart.draw(data, options);
  }
  //ajax end
  </code></pre>
  
  <p>and my view <strong>html</strong></p>
  
  <pre><code>&lt;div class="grid text-center" style="display: block;"&gt;
    &lt;h1 style="  color: black; font-size: 18px;"&gt;Summary of Daily Utilization of Library Holdings per Department&lt;/h1&gt;
  
             &lt;div class="input-group"&gt;
                                    &lt;span class="input-group-addon"&gt;@&lt;/span&gt;
                                    &lt;select id="selectyear" class="form-control selectyear" data-mobile="true" name="year" onchange="year();"&gt;
                                   &lt;?php 
  
                                   for ($i=$min_year; $i &lt;= $max_year; $i++) { 
  
                                    echo "&lt;option&gt;".$i."&lt;/option&gt;";
                                   }
                                    ?&gt; 
                                    &lt;/select&gt;
             &lt;/div&gt;
  
    &lt;h1 style="  color: gray; font-size: 14px;"&gt;S. Y. 2011-2012, 2012-2013 &amp; 2013-2014&lt;/h1&gt;
  
    &lt;div id="chart_div1" class="chart" style="height: 400px; width: 100%;"&gt;&lt;/div&gt;
    &lt;div id="chart_div2" class="chart" style="height: 400px; width: 100%;"&gt;&lt;/div&gt;
  </code></pre>
  
  <p></p>
  
  <p>in my <strong>controller</strong></p>
  
  <pre><code>public function chart($year)
  {
     $data = $this-&gt;views-&gt;chart($year);
   //Either you can print value or you can send value to database
  echo json_encode($data);
  }
  </code></pre>
  
  <p>no problem with ajax because when I do a debugging ajax successfully retrieve the value from database, the problem is when I put that value to my column chart like what I did in my code I've got that error.. help me please. this is the last problem I have to my thesis project.. thanks. I want to change the column chart value if the drop down has change.</p>