数据越来越而是采用了棱角分明的js剑道网格填充不 [英] Data is getting but not populating in kendo grid using angular js

查看:99
本文介绍了数据越来越而是采用了棱角分明的js剑道网格填充不的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我能够从数据库中的数据,但在GridView控件不填充。
这里是我的code如下:

\r
\r

< D​​IV NG-应用=应用程序NG控制器=MyCtrl >\r
    < D​​IV剑道网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

\r
\r

这就是我得到的数据,控制器页

\r
\r

公众的ActionResult Employee_Read([DataSourceRequest] DataSourceRequest要求)\r
        {\r
            // IQueryable的< IEmployeeRepositary> employeeRep = employeeRepositary.Employees;\r
            返回JSON(employeeRepositary.Employees.ToDataSourceResult(要求),JsonRequestBehavior.AllowGet);\r
        }

\r

\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屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆