如何获取javascript datepicker值以使折线图动态化

Question

我尝试使用以前是静态的js折线图制作折线图，并尝试使用php修改折线图以从数据库中获取数据，还尝试添加datepicker使数据图动态化。

我尝试检索通过日期选择器选择的要包含在图表中的数据时遇到问题

这是我的折线图代码

<script>
   var config =
   {
       type: 'line',
       data:
       {
           labels: ["1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11", "12", "13", "14", "15", "16", "17", "18", "19", "20", "21", "22", "23", "24", "25", "26", "27", "28", "29", "30", "31"],
           datasets:
           [
               {
                   label: "Mercu",
                   data:
                   [
                      <?php
                          $data=array();
                          for($i=1; $i<=31; $i++)
                          {
                              $data[$i-1]=$i;
                          }
                                        $x = 0;
                                        $tgl = "2014"."-"."12"."-"; //**this variable that I want to make dynamic value from datepicker**
                                        $tgl2 = "";
                                        for($i=0; $i<31; $i++)
                                        {
                                            $tgl2 = $tgl.(String)$data[$i];
                                            $dbquery = $this->db->query("SELECT * FROM debitsungai WHERE tgl='$tgl2'")->num_rows();
                                            if($dbquery==0)
                                            {
                                                echo $x;
                                            }
                                            else
                                            {
                                                $variable = $this->db->query("SELECT * FROM debitsungai WHERE tgl='$tgl2'")->result();
                                                foreach ($variable as $key)
                                                {
                                                    echo $key->mercuQ;
                                                }
                                            }
                                    ?>,
                                    <?php
                                        }
                                    ?>
                                ],
                                fill: false,
                                borderDash: [5, 5],
                            },

                    options:
                    {
                        responsive: true,
                        title:
                        {
                            display:true,
                            text:'Daerah Irigasi ...'
                        },
                        tooltips:
                        {
                            mode: 'label',
                            callbacks:
                            {

                            }
                        },
                        hover:
                        {
                            mode: 'dataset'
                        },
                        scales:
                        {
                            xAxes:
                            [
                                {
                                    display: true,
                                    scaleLabel:
                                    {
                                        display: true,
                                        labelString: 'Tanggal'
                                    }
                                }
                            ],
                            yAxes:
                            [
                                {
                                    display: true,
                                    scaleLabel:
                                    {
                                        display: true,
                                        labelString: 'Debit Air (Lt/detik)'
                                    },
                                    ticks:
                                    {
                                        suggestedMin: -10,
                                        suggestedMax: 250,
                                    }
                                }
                            ]
                        }
                    }
                };

            $.each(config.data.datasets, function(i, dataset) {
                dataset.borderColor = randomColor(0.4);
                dataset.backgroundColor = randomColor(0.5);
                dataset.pointBorderColor = randomColor(0.7);
                dataset.pointBackgroundColor = randomColor(0.5);
                dataset.pointBorderWidth = 1;
            });

            window.onload = function() {
                var ctx = document.getElementById("canvas").getContext("2d");
                window.myLine = new Chart(ctx, config);
            };


        </script>

这是我的日期选择器代码

.....
 <body>
            <div class="form-group">
                <label>Bulan Pencatatan Debit</label>
                <input type="text" id="datepicker" class="form-control form-control-1 input-sm" value="2016-07-" placeholder="Bulan" >
            </div>
  <script>
     $('#datepicker').datepicker({autoclose: true, minViewMode: 1, format:'yyyy-mm-'})
  </script>
  </body>

我是否可以检索使用javascript创建的datepicker值以供我在php中使用？谢谢