how to display json data in ng-grid in angularjs
17,396
The 'data' property in ng-grid accepts the name of the data object, in your case the name is "persons" since the response from your HTTP request goes to $scope.persons
.
Example:
$scope.gridOptions = {
data: 'persons',
columnDefs: [
{field: 'DirectLine', displayName: 'DirectLine'},
{field:'Email', displayName:'Email'}
{field:'Employee', displayName:'Employee'}
{field:'Extention', displayName:'Extention'}
{field:'Id', displayName:'Id'}
{field:'PhoneNumber', displayName:'PhoneNumber'}
{field:'Title', displayName:'Title'}
]
};
Live example: http://plnkr.co/edit/UndbtO?p=preview
Author by
Shekkar
Updated on June 04, 2022Comments
-
Shekkar almost 2 years
I am new to Angularjs , I want to display the JSON data from webservice response to in grid form by using ng-grid .My code is here
function TestController($scope, $http) { alert("test"); $http({ url: 'http://my_Personal_Url', method: "POST", data: postData, headers: {'Content-Type': 'application/jsonp'} }).success(function (data, status, headers, config) { $scope.persons = data; // }).error(function (data, status, headers, config) { alert("test2"); $scope.status = status; });
But In the above code the PostData is not defined.my ng-grid scope is like this
$scope.gridOptions = { data: 'myData', columnDefs: [ {field: 'DirectLine', displayName: 'DirectLine'}, {field:'Email', displayName:'Email'} {field:'Employee', displayName:'Employee'} {field:'Extention', displayName:'Extention'} {field:'Id', displayName:'Id'} {field:'PhoneNumber', displayName:'PhoneNumber'} {field:'Title', displayName:'Title'} ] };
NOw how can i get the data from json object to myData ? so that i can use ng-grid as
<div ng-controller="TestController"> <div class="gridStyle" ng-grid="gridOptions"></div> </div>
here the my personal url (it is confidential so i don't want to show ) The above code shows sometimes as postData is not defined and sometimes getting 405 error .
Please explain the problem with the plunker link