Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Already on GitHub? Sign in to your account

Cannot set property 'gridDim' of undefined #60

Closed
tamitutor opened this Issue Dec 20, 2012 · 11 comments

Comments

Projects
None yet
10 participants

Getting this error (as stated in the subject line) when attempting to use your grid with a node.js/angular app (based on an app seed found at https://github.com/btford/angular-express-seed).

I've added 'ngGrid' to my app within the app.js (found under 'public/js/'):
angular.module('myApp', ['myApp.filters', 'myApp.services', 'myApp.directives', 'ngGrid'])

I've ensured that ng-grid-1.4.1.js is added in the index.jade file (found under 'views/')

Inside the controllers.js file (found under 'public/js/') I've added the following within my ListLicenseCtrl (within a callback to my api):
function ListLicensesCtrl($scope, $http) {
$http.get('/api/licenses').
success(function(data, status, headers, config) {
$scope.licenses = data.licenses;
$scope.gridOptions = {
data: 'licenses',
columnDefs: [
{field:'orgId', displayName:'Org Id'},
{field:'organizationName', displayName:'Org Name'},
{field:'orderAgreement', displayName:'Order Agreement'},
{field:'licenseType', displayName:'License Type'},
{field:'status', displayName:'Status'}
]
}
});
}

Inside the jade template where the grid will be displayed I've added the following:
div(class="gridStyle", ng-grid="gridOptions")

Any ideas on how to resolve this problem?

Thanks,

Tami

Member

timothyswt commented Dec 20, 2012

You can't define the grid options in the success call. You need to define
them on the scope in your controller and then set the data or column
definitions, etc... from the success call.

On Wednesday, December 19, 2012, Tami Wright wrote:

Getting this error (as stated in the subject line) when attempting to use
your grid with a node.js/angular app (based on an app seed found at
https://github.com/btford/angular-express-seed).

I've added 'ngGrid' to my app within the app.js (under 'public/js/'):
angular.module('myApp', ['myApp.filters', 'myApp.services',
'myApp.directives', 'ngGrid'])

I've ensured that ng-grid-1.4.1.js is added in the index.jade file (under
'views/')

Inside the controllers.js file (under 'public/js/') I've added the
following within my ListLicenseCtrl (within a callback to my api):
function ListLicensesCtrl($scope, $http) {
$http.get('/api/licenses').
success(function(data, status, headers, config) {
$scope.licenses = data.licenses;
$scope.gridOptions = {
data: 'licenses',
columnDefs: [
{field:'orgId', displayName:'Org Id'},
{field:'organizationName', displayName:'Org Name'},
{field:'orderAgreement', displayName:'Order Agreement'},
{field:'licenseType', displayName:'License Type'},
{field:'status', displayName:'Status'}
]
}
});
}

Inside the jade template where the grid will be displayed I've added the
following:
div(class="gridStyle", ng-grid="gridOptions")

Any ideas on how to resolve this problem?

Thanks,

Tami


Reply to this email directly or view it on GitHubhttps://github.com/angular-ui/ng-grid/issues/60.

-Tim Sweet

eu81273 commented Dec 20, 2012

function ListLicensesCtrl($scope, $http){

$scope.licenses = [];
$scope.gridOptions = {
    data: 'licenses',
    columnDefs: [
    {field:'orgId', displayName:'Org Id'},
    {field:'organizationName', displayName:'Org Name'},
    {field:'orderAgreement', displayName:'Order Agreement'},
    {field:'licenseType', displayName:'License Type'},
    {field:'status', displayName:'Status'}
    ]
}


$http.get('/api/licenses').
    success(function(data, status, headers, config) {
        $scope.licenses = data.licenses;
});

}

Thanks guys
On Dec 20, 2012 3:11 AM, "Steve" notifications@github.com wrote:

function ListLicensesCtrl($scope, $http) {

$scope.licenses = [];

$scope.gridOptions = {
data: 'licenses',
columnDefs: [
{field:'orgId', displayName:'Org Id'},
{field:'organizationName', displayName:'Org Name'},
{field:'orderAgreement', displayName:'Order Agreement'},
{field:'licenseType', displayName:'License Type'},
{field:'status', displayName:'Status'}
]
}

$http.get('/api/licenses').
success(function(data, status, headers, config) {
$scope.licenses = data.licenses;
});

}


Reply to this email directly or view it on GitHubhttps://github.com/angular-ui/ng-grid/issues/60#issuecomment-11563498.

@timothyswt timothyswt closed this Dec 20, 2012

I have a usecase to keep the gridOptions in some JSON. How can I achieve this ?

Member

c0bra commented Jun 11, 2013

@yogeshgadge angular has these methods: angular.fromJson() and angular.toJson(). You can then store the options and parse them however you choose.

I believe the problem is more of getting the gridOptions from a promise returned from the $resource call. As per the documentation the $resource will return a reference to an empty array or an empty document on the call.

Anyway I was lucky that the grid was in a dialog box - I made sure the dialog.open was called on the promise success.

ng-grid calls $scope.$eval ng-grid attribute to get the options but that would not block anything.

I think defered gridOptions will not work.

I am thinking the other option could be to move these gridOptions to constants or the templates instead of . $resource/$http and just preload store these values as constants.

johnyno commented Jun 13, 2013

thanks!! I has the same problem

blowsie commented Aug 22, 2013

Any workarounds for this issue?

My modules in my application are private, the templates are loaded using the native angular approach and controllers are lazy loaded via require js.

This causes the grid the throw the error mentioned. Cannot set property 'gridDim' of undefined

TypeError: Cannot set property 'gridDim' of undefined
at pre (http://angular-ui.github.io/ng-grid/lib/ng-grid.debug.js:3063:37)
at j (https://ajax.googleapis.com/ajax/libs/angularjs/1.0.2/angular.min.js:42:195)
at e (https://ajax.googleapis.com/ajax/libs/angularjs/1.0.2/angular.min.js:38:207)
at e (https://ajax.googleapis.com/ajax/libs/angularjs/1.0.2/angular.min.js:38:224)
at j (https://ajax.googleapis.com/ajax/libs/angularjs/1.0.2/angular.min.js:42:255)
at e (https://ajax.googleapis.com/ajax/libs/angularjs/1.0.2/angular.min.js:38:207)
at e (https://ajax.googleapis.com/ajax/libs/angularjs/1.0.2/angular.min.js:38:224)
at https://ajax.googleapis.com/ajax/libs/angularjs/1.0.2/angular.min.js:37:339
at https://ajax.googleapis.com/ajax/libs/angularjs/1.0.2/angular.min.js:15:440
at Object.e.$eval (https://ajax.googleapis.com/ajax/libs/angularjs/1.0.2/angular.min.js:86:220)

angular.min.js:60
TypeError: Cannot set property 'gridDim' of undefined
at pre (http://angular-ui.github.io/ng-grid/lib/ng-grid.debug.js:3063:37)
at j (https://ajax.googleapis.com/ajax/libs/angularjs/1.0.2/angular.min.js:42:195)
at e (https://ajax.googleapis.com/ajax/libs/angularjs/1.0.2/angular.min.js:38:207)
at e (https://ajax.googleapis.com/ajax/libs/angularjs/1.0.2/angular.min.js:38:224)
at e (https://ajax.googleapis.com/ajax/libs/angularjs/1.0.2/angular.min.js:38:224)
at j (https://ajax.googleapis.com/ajax/libs/angularjs/1.0.2/angular.min.js:42:255)
at e (https://ajax.googleapis.com/ajax/libs/angularjs/1.0.2/angular.min.js:38:207)
at e (https://ajax.googleapis.com/ajax/libs/angularjs/1.0.2/angular.min.js:38:224)
at https://ajax.googleapis.com/ajax/libs/angularjs/1.0.2/angular.min.js:37:339
at https://ajax.googleapis.com/ajax/libs/angularjs/1.0.2/angular.min.js:15:440

I have used common ng-controller="MyCtrl" at the body tag calling three different Grid on the same page width ng-grid="gridOptions" , ng-grid="gridOptionsone" ,ng-grid="gridOpctionstwo"
but what i find is the most recently edited json file data showed in the ng-grid of the home page .Rest of the two grids data are not showen shown. Can i know why is this happening ! do i need to write services for this if so why .

Cant we view the three grid on the same page or viewing the grid's are only one at the time.

natee commented Apr 23, 2014

Thanks very much for solving the problem!

Gracias por la solución!! (Y)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment