数据越来越而是采用了棱角分明的js剑道网格填充不 [英] Data is getting but not populating in kendo grid using angular js
问题描述
我能够从数据库中的数据,但在GridView控件不填充。
这里是我的code如下:
< DIV NG-应用=应用程序NG控制器=MyCtrl >\r
< DIV剑道网K-选项=gridOptionsK-重新绑定=gridOptionsK-分页='{的pageSize:2,刷新:真实的页面大小:真正}'>< / DIV>\r
< / DIV>\r
<脚本>\r
angular.module(应用程序,[kendo.directives])。控制器(MyCtrl功能($范围,$ HTTP){\r
$ scope.gridOptions = {\r
列:[{场:EmployeeKey},{场:名字}],\r
数据源: {\r
//模式:{\r
//数据:D\r
//},\r
类型:JSONP\r
运输: {\r
\r
阅读:功能(E){\r
\r
$ HTTP({方法:GET,网址:'/员工/ Employee_Read'})。\r
成功(功能(数据,状态,头,配置){\r
//警报('Sucess')\r
//调试;\r
\r
e.success(数据)\r
})。\r
错误(功能(数据,状态,头,配置){\r
警报('出事了')\r
的console.log(状态);\r
});\r
}\r
},\r
//每页:5\r
}\r
}\r
});\r
< / SCRIPT>
\r
这就是我得到的数据,控制器页
公众的ActionResult Employee_Read([DataSourceRequest] DataSourceRequest要求)\r
{\r
// IQueryable的< IEmployeeRepositary> employeeRep = employeeRepositary.Employees;\r
返回JSON(employeeRepositary.Employees.ToDataSourceResult(要求),JsonRequestBehavior.AllowGet);\r
}
\r
因此运行我的应用程序后,我公司通过调试这条线检查
e.success(数据),所以在鼠标霍夫我收到从数据库中读取的总记录。但在GridView控件不填充它仍然显示空白。
请帮我从这里开始。
由于您正在返回集合里面包裹与 DataSourceResult
方法。
返回JSON(employeeRepositary.Employees.ToDataSourceResult(要求),JsonRequestBehavior.AllowGet);
而不仅仅是其收藏
返回JSON(employeeRepositary.Employees,JsonRequestBehavior.AllowGet);
您需要定义数据源模式
,请尝试这种架构设置
模式:{
数据:数据,
错误:错误,
总说:总,
型号:{
ID:ID,
字段:{
ID:{编辑:假的,设置defaultValue:0},
//其余的字段定义
}
}
}
,你可以改变你的交通工具的读
来这样的事情
阅读:{
键入:POST,
网址:/员工/ Employee_Read
数据类型:JSON
的contentType:应用/ JSON
}
您的最终code应该是这样的。
$ scope.gridOptions = {
列:[{场:EmployeeKey},{场:名字}],
数据源: {
运输: {
阅读:{
键入:POST,
网址:/员工/ Employee_Read
数据类型:JSON
的contentType:应用/ JSON
},
parameterMap的:功能(选择,操作){
返回JSON.stringify(选件);
}
},
每页:5,
模式:{
数据:数据,
错误:错误,
总说:总,
型号:{
ID:EmployeeKey
字段:{
EmployeeKey:{编辑:假的,设置defaultValue:0},
姓:{类型:字符串,验证:{要求:真正}}
}
}
}
}
}
和控制器这样
的[AcceptVerbs(HttpVerbs.Get | HttpVerbs.Post)
公众的ActionResult Employee_Read([DataSourceRequest] DataSourceRequest要求)
{
VAR员工= employeeRepositary.Employees; 返回JSON(employees.ToDataSourceResult(要求),JsonRequestBehavior.AllowGet);
}
I am able to get the data from database but not populating in gridview. here is my code below:
<div ng-app="app" ng-controller="MyCtrl">
<div kendo-grid k-options="gridOptions" k-rebind="gridOptions" k-pageable='{ "pageSize": 2, "refresh": true, "pageSizes": true }'></div>
</div>
<script>
angular.module("app", ["kendo.directives"]).controller("MyCtrl", function ($scope, $http) {
$scope.gridOptions = {
columns: [{ field: "EmployeeKey" }, { field: "FirstName" }],
dataSource: {
//schema: {
// data: "d"
//},
type: "jsonp",
transport: {
read: function (e) {
$http({ method: 'GET', url: '/Employee/Employee_Read' }).
success(function (data, status, headers, config) {
// alert('Sucess')
//debugger;
e.success(data)
}).
error(function (data, status, headers, config) {
alert('something went wrong')
console.log(status);
});
}
},
//pageSize: 5
}
}
});
</script>
and this is the controller page where i am getting data
public ActionResult Employee_Read ([DataSourceRequest] DataSourceRequest request )
{
//IQueryable<IEmployeeRepositary> employeeRep = employeeRepositary.Employees;
return Json(employeeRepositary.Employees.ToDataSourceResult(request), JsonRequestBehavior.AllowGet);
}
so after running my application i am checking through debugger this line "e.success(data)" so in mouse hove i am getting the total records fetched from database. but not populating in gridview it is still showing blank. please help me out from here.
Because you are returning collection which wrapped with DataSourceResult
method.
return Json(employeeRepositary.Employees.ToDataSourceResult(request), JsonRequestBehavior.AllowGet);
instead of just its collection
return Json(employeeRepositary.Employees, JsonRequestBehavior.AllowGet);
You need to define your data source schema
, please try this schema setup
schema: {
data: "Data",
errors: "Errors",
total: "Total",
model: {
id: "Id",
fields: {
Id: { editable: false, defaultValue: 0 },
//the rest field definition
}
}
}
and you can change your transport's read
to something like this
read: {
type: "POST",
url: "/Employee/Employee_Read",
dataType: "json",
contentType: "application/json"
}
your final code should be like this
$scope.gridOptions = {
columns: [{ field: "EmployeeKey" }, { field: "FirstName" }],
dataSource: {
transport: {
read: {
type: "POST",
url: "/Employee/Employee_Read",
dataType: "json",
contentType: "application/json"
},
parameterMap: function(options, operation) {
return JSON.stringify(options);
}
},
pageSize: 5,
schema: {
data: "Data",
errors: "Errors",
total: "Total",
model: {
id: "EmployeeKey",
fields: {
EmployeeKey: { editable: false, defaultValue: 0 },
FirstName: {type: "string", validation: { required: true }}
}
}
}
}
}
and your controller like this
[AcceptVerbs(HttpVerbs.Get | HttpVerbs.Post)]
public ActionResult Employee_Read ([DataSourceRequest] DataSourceRequest request )
{
var employees = employeeRepositary.Employees;
return Json(employees.ToDataSourceResult(request), JsonRequestBehavior.AllowGet);
}
这篇关于数据越来越而是采用了棱角分明的js剑道网格填充不的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!