[英]Kendo grid not displaying data MVVM
I am not sure what I am doing wrong 我不确定自己在做什么错
My HTML 我的HTML
<head>
<title></title>
<script src="include/libraries/jquery/jquery-2.2.2.min.js"></script>
<script src="include/libraries/jquery/jquery-2.2.2.intellisense.js"></script>
<script src="include/libraries/jquery/jquery-2.2.2.js"></script>
<link href="include/libraries/kendo/css/kendo.bootstrap.min.css" rel="stylesheet" />
<link href="include/libraries/kendo/css/kendo.common-bootstrap.min.css" rel="stylesheet" />
<script src="include/libraries/kendo/js/kendo.all.js"></script>
<script src="include/libraries/kendo/js/kendo.all.min.js"></script>
<script src="include/libraries/kendo/js/kendo.aspnetmvc.min.js"></script>
<script src="include/libraries/kendo/js/kendo.custom.min.js"></script>
<script src="include/libraries/kendo/js/kendo.timezones.min.js"></script>
<meta charset="utf-8" />
</head>
<body>
<div id="grid">
<div class="demo-section k-content wide">
<div>
<h4>Add or update a record</h4>
<div data-role="grid"
data-editable="true"
data-toolbar="['create', 'save']"
data-columns="[
{ 'field': 'CourseID' },
{ 'field': 'CourseName' },
{ 'field': 'IsActive' },
]"
data-bind="source: courses,
visible: isVisible,
events: {
save: onSave
}"
style="height: 200px"></div>
</div>
</div>
<script>
var viewModel = kendo.observable( {
isVisible: true,
onSave: function(e) {
kendoConsole.log("event :: save(" + kendo.stringify(e.values, null, 4) + ")");
},
courses: new kendo.data.DataSource({
schema: {
model: {
id: "CourseID",
fields: {
CourseID: { type: "number" },
CourseName: { type: "string" },
IsActive:{type:"boolean"}
}
}
},
batch: true,
transport: {
read: {
type:"GET",
url: "http://localhost:51447/api/Courses",
dataType: "jsonp"
},
parameterMap: function(options, operation) {
if (operation !== "read" && options.models) {
return {models: kendo.stringify(options.models)};
}
}
}
})
});
kendo.bind($("#grid"), viewModel);
</script>
</div>
</body>
My Controller Code // GET: api/Courses 我的控制器代码 // GET:API /课程
public IQueryable<object> GetCourses()
{
return db.Courses.Select(
o => new
{
CourseID = o.CourseID,
CourseName = o.CourseName,
IsActive = o.IsActive
});
//}).Where(l => l.IsActive == false);
}
My JSON [{"CourseID":1,"CourseName":"Beauty Therapy","IsActive":true},{"CourseID":2,"CourseName":"Software Development","IsActive":true},{"CourseID":3,"CourseName":"Bookkeeping and Accounting","IsActive":true}] 我的JSON [{“ CourseID”:1,“ CourseName”:“ Beauty Therapy”,“ IsActive”:true},{“ CourseID”:2,“ CourseName”:“ Software Development”,“ IsActive”:true},{ “ CourseID”:3,“ CourseName”:“簿记和会计”,“ IsActive”:true}]
I finally got this fixed. 我终于解决了这个问题。 The structure of my solution is such that it has a WebAPI and a Web app.
我的解决方案的结构使得它具有WebAPI和Web应用程序。 So in the WebApiConfig.cs file I added the line config.EnableCors();
因此,在WebApiConfig.cs文件中,我添加了config.EnableCors();行。 and it worked.
而且有效。
public static void Register(HttpConfiguration config)
{
// Web API configuration and services
config.EnableCors();
// Web API routes
config.MapHttpAttributeRoutes();
config.Routes.MapHttpRoute(
name: "DefaultApi",
routeTemplate: "api/{controller}/{id}",
defaults: new { id = RouteParameter.Optional }
);
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.