I've encountered an issue while showing the bar chart. If I'm giving the static date in controller it works fine, but when I change the date from Report range it doesn't show anything in graph neither in the table. Apparently the request response are successful to and from the server the problem is in my view where I'm receiving the data, your advise 'll be hugely appreciated. Thanks in advance. Ps- my view goes below
.Net Framework
<script type="text/javascript">
$(document).ready(function() {
$("#reportrange").on("apply.daterangepicker", function(a, b) {
var url = "/Owner/SalesbyItemDateRange/" + @Session["O_id"];
var start = b.startDate.format('YYYY-MM-DD HH:mm:ss');
var end = b.endDate.format('YYYY-MM-DD HH:mm:ss');
console.log(start + "---" + end);
// var ctx = document.getElementById("myChart").getContext('2d');
$.ajax({
url: url,
method: 'Get',
headers: {
'Authorization': 'Basic ' + sessionStorage.getItem("PUserEncrypt"),
},
data: {
startDateIn: start,
endDateIn: end
},
success: function(result) {
console.log('SalesbyItem');
console.log(result.barsData);
console.log(result.ykeys);
//document.getElementById('graph_bar1').innerHTML = "";
new Morris.Bar({
element: 'graph_bar1',
data: [
result.barsData
//Html.Raw(ViewData.Model.barsData)
],
xkey: 'y',
ykeys: result.ykeys,
@ * [@Html.Raw(ViewData.Model.yKeys)] * @
xLabelMargin: 10,
labels: result.ykeys,
@ * [@Html.Raw(ViewData.Model.yKeys)],
* @
hideHover: 'auto',
stacked: true,
gridTextSize: '12',
resize: true
});
//update table
},
error: function(jqXHR) {
alert(jqXHR.responseText);
}
});
});
var val = 0;
$("#myButtons :input").change(function() {
val = this.value;
console.log(val); // points to the clicked input button
});
var url = "/Owner/SalesbyItem/" + @Session["O_id"];
var start = moment().subtract(6, 'days').format('YYYY-MM-DD hh:mm:ss');
var end = moment().format('YYYY-MM-DD hh:mm:ss');
console.log(start + "--" + end);
// var ctx = document.getElementById("myChart").getContext('2d');
$.ajax({
url: url,
method: 'Get',
headers: {
'Authorization': 'Basic ' + sessionStorage.getItem("PUserEncrypt"),
},
data: {
startDateIn: start,
endDateIn: end
},
success: function(result) {
document.getElementById('graph_bar1').innerHTML = "";
new Morris.Bar({
element: 'graph_bar1',
data: [
@Html.Raw(ViewData.Model.barsData)
],
xkey: 'y',
ykeys: [@Html.Raw(ViewData.Model.yKeys)],
xLabelMargin: 10,
labels: [@Html.Raw(ViewData.Model.yKeys)],
hideHover: 'auto',
stacked: true,
gridTextSize: '12',
resize: true
});
},
error: function(jqXHR) {
alert(jqXHR.responseText);
}
});
});
</script>