Try like this
Javascript
Get the data from controller using ajax
jQuery ajax() Method[
^]
jQuery.ajax() | jQuery API Documentation[
^]
<script>
$(document).ready(function () {
var link = '@Url.Action("GetData", "Home")';
$.ajax({
type: "POST",
url: link,
dataType: "json",
success: function (data) {
genChart(data);
}
});
});
function genChart(data) {
var m1 = new Morris.Line({
element: 'line-chart',
data: data,
xkey: 'y',
ykeys: ['a', 'b'],
labels: ['Series A', 'Series B'],
lineColors: ['#D9534F', '#428BCA'],
lineWidth: '2px',
hideHover: true
});
}
</script>
Controller
Get the data from a List and convert it to JSON format and return it to the Ajax method
public ActionResult GetData()
{
var data = new[] {
new { y = "2006", a = 30, b = 20 },
new { y = "2007", a = 75, b = 65 },
new { y = "2008", a = 50, b = 40 },
new { y = "2009", a = 75, b = 60 },
new { y = "2010", a = 50, b = 80 },
new { y = "2011", a = 30, b = 50 }
};
return Json(data);
}
Let me know if you face any issue.