kendoGrid 获取后台返回的json数据并展示在页面上

url是请求的controller名称，还有该控制器里边的Action名称，id是我写死的11，因为这是只是测试。请根据实际需求，把id传入对应的变量。

@{
ViewBag.Title = "科研项目汇总";
Layout = "~/Views/Shared/_LayoutMetronicMain.cshtml";
}

<!-- BEGIN PAGE HEADER-->
<div class="row">
<div class="col-md-12">
<!-- BEGIN PAGE TITLE & BREADCRUMB-->
<h3 class="page-title">
科研项目管理 <small></small>
</h3>
<ul class="page-breadcrumb breadcrumb">
<li>
<i class="fa fa-home"></i>
<a href="/">
MedRIS
</a>
<i class="fa fa-angle-right"></i>
</li>
<li>
<a href="javascript:void(0)">
科研项目汇总
</a>
</li>
</ul>
<!-- END PAGE TITLE & BREADCRUMB-->
</div>
</div>
<div class="p
4000
ortlet">
<div class="portlet-title">
<div class="caption">
<i class="fa fa-shopping-cart"></i>科研项目汇总
</div>
</div>
<div class="portlet-body">
<div id="grid"></div>
</div>
</div>
<style>
.k-header {
text-align:center !important ;
}
.k-pager-sizes {
display:none !important;
}

</style>
<script type="text/javascript">

$(function () {
$("#grid").kendoGrid({
dataSource: {
transport:
{
read: {
url: "@Url.Action("GetData/11", new {  controller = "ProjectSupervisionUnit" })",
dataType: "json"
}
},
pageSize: 10
},
attributes: { "class": "grid-algin-center" },
pageable: {
refresh: false,
pageSizes: true,
messages: {
display: "{0} - {1} 共 {2} 条数据",
empty: "没有数据",
page: "页",
of: "/ {0}",
itemsPerPage: "条每页",
first: "第一页",
previous: "前一页",
next: "下一页",
last: "最后一页",
refresh: "刷新"
}
},
columns: [{
field: "Name",
title: "项目名称",
width: 200
}, {
field: "OwnerUserCode",
title: "负责人"
}, {
field: "Patient_IdSUMS",
title: "病例数"
}, {
field: "CRFForm_IdSUMS",
title: "表单数"
}, {
field: "CreateDate",
title: "开始日期"
}]
});
});
</script>