Как получить значение DatePicker JavaScript, чтобы сделать динамический график
Я попытался создать линейный график с использованием линейной диаграммы js, которая раньше была статической, и я попытался изменить ее с помощью php для получения данных из базы данных, а также попытался добавить средство выбора даты, чтобы сделать диаграмму данных динамичной.
У меня возникла проблема при попытке извлечь данные, выбранные с помощью средства выбора даты, для включения в диаграмму
это мой линейный код
<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>
и это мой код DatePicker
.....
<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>
Могу ли я получить значение datepicker, которое было создано с использованием javascript для использования в php? Спасибо
Решение
Задача ещё не решена.
Другие решения
Других решений пока нет …