kendo chart refresh data not change - kendo-ui

Question

I'm using a Kendo Chart, the first call works fine but when I call refresh_interval 5000 is called, the charts doesn't update. he updated data is displayed on the console.
brings back the old results every time. When I refresh the page, I want the chart to bring the updated results.
What am i doing wrong?
my code :
<script th:inline="javascript">
$(function(){
var page = 1;
createMonthChart(today, 1);
$(window).resize(function(){
$("#chart_month").data("kendoChart").refresh();
});
});
function createMonthChart(today, page) {
var date = today;
$("#chart_month").kendoChart({
dataSource: {
transport: {
read: {
url: "dashboard/monthProcess.json?date="+date+"&&pageNo="+page
}
}
},
legend: {
position: "bottom",
labels: {
margin:5,
},
},
seriesDefaults: {
type: "column",
stack: true,
labels:{
visible :true,
position:"center",
background : "transparent",
template: "#if (value > 0) {# #: value # #}#"
}
},
series: [{
field: "success",
name : "success",
categoryField: "processName"
},
{
field: "fail",
name : "fail",
categoryField: "processName"
}
],
seriesColors: ["#3CB371", "#FF6347"],
});
}
</script>
<script th:inline="javascript">
var refresh_interval = 5000;
$(function(){
var timer;
var select = $("select#resetTimeSelect");
select.siblings("label").text(select.children("option:selected").text()); //refresh time select
select.change(function(){
var select_name = $(this).children("option:selected").text();
$(this).siblings("label").text(select_name);
window.refresh_interval = $(this).children("option:selected").val();
refresh();
});
window.onbeforeunload = function() {
clearInterval(window.timer);
}
var ajaxRunning = false;
refresh();
});
function refresh(){
if(window.refresh_interval != "stop"){
window.timer = setInterval(function(){
loadRobotCount();
pageNo = pageNo + 1;
if(pageNo == totalPage){
pageNo = 1;
}
ChartRefreshMonth(today, pageNo);
}, window.refresh_interval);
}
}
function ChartRefreshMonth(today, page){
var date = today;
$.ajax({
url: "dashboard/monthProcess.json?date="+date+"&&pageNo="+page,
type : "GET",
dataType : "json",
cache : false,
contentType : "text/json; charset=UTF-8",
success : function(data) {
totalPage = data[0].recordCountPerPage;
$("#chart_month").data("kendoChart").dataSource.read();
var chart = $("#chart_month").data("kendoChart");
chart.refresh();
},
error : function(xhr, status, err){
alert(FailMessage);
}
});
}
</script>

Answer 1

In ChartRefreshMonth, this code:
$("#chart_month").data("kendoChart").dataSource.read();
does a call to the backend with the old url.
The result of the call that you are making isn't passed anywhere.
You need to pick 1 of 2 approaches:
the dataSource handles the back-end calls
you handle the calls and then do dataSource.data(result)
Both will work, but you need to pick one and do it right.