title: Filter highchart gantt base on dropdown select with ajax
body: <p>I have a gantt chart whose data I retrieved from the database using ajax, here is the code:</p>
  <pre><code>$.getJSON('src/json/schedule/data.php', function(data){
          if(data.length &gt;0){
              var dta = [];
              for(var i =0;i&lt;data.length;i++)dta.push(data[i]);
  Highcharts.ganttChart('schedule', {
  
      title: {
          text: ''
      },
      accessibility: {
          point: {
              descriptionFormatter: function (point) {
                  return Highcharts.format(
                      point.milestone ?
                          '{point.name}, milestone for {point.kontraktor} at {point.x:%Y-%m-%d}.' :
                          '{point.name}, assigned to {point.kontraktor} from {point.x:%Y-%m-%d} to {point.x2:%Y-%m-%d}.',
                      { point }
                  );
              }
          }
      },
  
  
      yAxis: {
          type: 'category',
          grid: {
              enabled: true,
              borderColor: 'rgba(0,0,0,0.3)',
              borderWidth: 1,
              columns: [{
                  title: {
                      text: 'Project'
                  },
                  labels: {
                      format: '{point.name}'
                  }
              },{
                  title: {
                      text: 'Durasi'
                  },
                  labels: {
                      formatter: function () {
                          var point = this.point,
                              days = (1000 * 60 * 60 * 24),
                              number = (point.x2 - point.x) / days;
                          return Math.round(number * 100) / 100;
                      }
                  }
              }, {
                  labels: {
                      format: '{point.start:%e %b %Y}'
                  },
                  title: {
                      text: 'Start'
                  }
              }, {
                  title: {
                      text: 'Finish'
                  },
                  offset: 30,
                  labels: {
                      format: '{point.end:%e %b %Y}'
                  }
              }]
          }
      },
  
      tooltip: {
          xDateFormat: '%e %b %Y'
      },
  
      series: [{
          name: 'Project 1',
          data: dta
      }],
  
      exporting: {
          sourceWidth: 1000
      }
  });
  }
  });
  </code></pre>
  <p>data.php</p>
  <pre><code>header(&quot;Content-type: application/json&quot;);
  include 'config/database.php';
  $db = new database();
  $mysqli = $db-&gt;connect();
  $i = 1;
  $y = 0;
  $sql = &quot;SELECT* FROM data_paket&quot;;
  $result = $mysqli-&gt;query($sql);
  while ($row = $result-&gt;fetch_assoc()) {;
      $data[$i]['code']           = $row['kode_project'];
      $data[$i]['name']           = $row['nama_paket'];
      $data[$i]['kontraktor']     = $row['kontraktor_spv'];
      date_default_timezone_set('Asia/Jakarta');
      $data[$i]['start']          = strtotime($row['start']) * 1000;
      $data[$i]['end']            = strtotime($row['finish']) * 1000;
      $data[$i]['y']              = $y;
      $i++;
      $y++;
  }
  
  $out = array_values($data);
  echo json_encode($out);
  </code></pre>
  <p>from there I want to create a data filter using the select dropdown whose value is sent to <strong>data.php</strong>.
  like :</p>
  <pre><code>&lt;select id=&quot;code&quot;&gt;
  &lt;option value=&quot;PR001&quot;&gt;PR001&lt;/option&gt;
  &lt;option value=&quot;PR002&quot;&gt;PR002&lt;/option&gt;
  &lt;/select&gt;
  </code></pre>
  <p>is it possible, or is there some other way i can do to filter my data from database and display it in chart .</p>