ng-grid - Programatically selecting rows how and other API's etc

[Matt Madhavan]

Hello,
I would like to Select the first row of the ng-grid after all the rows are added to the Grif from within the Controller.

The only option I see is to wait on a Grid Event - like ngGridEventData to occur, and select the row as follows(in the blue color)

            $scope.gridOptions = {
                    data: 'members',
                    showSelectionCheckbox: true,                    
                    multiSelect: true,  
                    enableColumnResize:true,
                    jqueryUITheme:true,
                          columnDefs: [
                                  {field:'Member', displayName:'Member'},
                                  {field:'Relationship', displayName:'Relationship'},
                                  {field:'DOB', displayName:'Date Of Birth'},
                                  {field:'SSN', displayName:'SSN'},
                                  {field:'Gender', displayName:'Gender'},
                                  {field:'MemberID', displayName:'ID'}
                    ]
            };                
           
            $scope.$on('ngGridEventData', function(){
                $scope.gridOptions.selectRow(0, true);
            });

Problem is the Event ngGridEventData is called once for every row in the Grid. Only after the Grid is fully initialized the gridOption is initialized with the methods like selectRow etc.

1. Is there any other better event from the ng-grid that is 'emitted' only when (and only once) after the Grid is fully initialized?
2. Is this the only way (via gridOptions) to do any programmatic access to the Grid?
   
3. Are there any additional documentation detailing the the ng-grid's design, lifecycle and API besides the WIKI page?

Spending lot of time on ng-grid because of ;lack' of documentation. One of the primary reason why I quit DOJO and moved to AngualrJS was because of the Documentaion and support. But in ng-grid I am kind of struggling a bit.

And any pointers on how to perform E2E testing on ng-grid like testing for first row selected etc will be appreciated.

I appreciate in advance!

Thanks

Matt'M

[Matt Madhavan]

Hello,
Any one out there please?

Thanks
Matt

[johntom]

Hi Matt,

Why don't you post this on https://github.com/angular-ui/ng-grid

HTH

John

[flybum]

I get ngGridEventData firing on every row if I populate the data array 1 entity at a time. I now populate a temp array and then assign it to the data array. ngGridEventData still fires 4 times, twice when the grid is in init and twice after I assign the data array.

In the controller I do something like:

 

                var dataWasLoaded = false;

                $scope.members = [];

 

                $scope.$on("ngGridEventData", function (ev, gridId) {

                                if (dataWasLoaded && $scope.gridOptions.ngGrid.data.length > 0) {

                                                dataWasLoaded = false;

                                                $scope.gridOptions.selectRow(0, true);

                                }

                });

 

                $scope.getEntityList = function () {

                                dataWasLoaded = false;

                                var tmp = [];

 

                                ... get array of entities via ajax and/or push items into tmp, maybe manipulate the items in tmp somehow ... remember, the grid is "watching" scope.members array so if you mess with it the grid may try to refresh.

 

                                $scope.members = tmp; <<<-- this is where the grid sees only one change to the data array. There is a "bug" in ngGrid that fires the ngGridEventData twice but does not seem to bother anything.

                                dataWasLoaded = true;

                }

 

[Matt Madhavan]

HI FlyBum,

Did you get a chance to resolve this issue. I think what we need is an event that is different or even better  than the Events published in this documentation.

https://github.com/angular-ui/ng-grid/wiki/Grid-Events

I am still looking - If you know if any other events like Grid Intialized or some thing more coarse grained please let me know!

Thanks
Matt'M

[code solver]

you can get the selected rows from a ng grid using selectedItems property. 

see getting-selected-rows-from-ng-grid for example.

[Gabriel Georgescu]

I'm not sure if this is the best way but it works for me.
Instead of watching for ngGridEventData:

            setTimeout(function(){
                $scope.gridOptions.selectRow(0, true);
            },0);

The 0 interval is supposed to execute the function in next digest cycle when grid is fully initialized.