grid.appScope is not working with paging

Question

Here code

Creating edit button on every row.

    var statusTemplate = '<button type="button" class="btn btn-default" ng-click="grid.appScope.add(lg,{{row.entity.StudentID}})">Add</button> ';    /** <div> {{row.entity.StudentID}}</div>**/
            $scope.studentModel = {
                paginationPageSizes: [10, 20, 75],
                paginationPageSize: 10,
                useExternalPagination: true,
                useExternalSorting: true,
                enableHorizontalScrollbar: uiGridConstants.scrollbars.NEVER,
                enableVerticalScrollbar: uiGridConstants.scrollbars.NEVER,
                columnDefs: [
                { field: 'StudentID', displayName: 'No.' },
                { field: 'StudentName', displayName: 'Name' },
                { field: 'Height', displayName: 'Height' },
                {
                    field: 'StudentID',
                    displayName: 'status',
                    cellTemplate: statusTemplate
                }
                ],
                onRegisterApi: function (gridApi) {
                    $scope.gridApi = gridApi;
                    $scope.gridApi.core.on.sortChanged($scope, function (grid, sortColumns) {
                        if (sortColumns.length == 0) {
                            paginationOptions.sort = null;
                            paginationOptions.sortBy = 'StudentID';
                        } else {
                            paginationOptions.sort = sortColumns[0].sort.direction;
                            paginationOptions.sortBy = sortColumns[0].field;
                        }
                        $scope.getAllUser();
                    });
                    gridApi.pagination.on.paginationChanged($scope, function (newPage, pageSize) {
                        paginationOptions.pageNumber = newPage;
                        paginationOptions.pageSize = pageSize;
                        $scope.getAllUser();

                    });
                }
            };

  $scope.add = function (size, id) {
            console.log(id);
});

I have 3 page in the grid.

On first page, ng-click="grid.appScope.add(lg,{{row.entity.StudentID}}) binding (rendering) perfect and click on button then got correct id on console result.

But When I go on second page then rendering StudentID perfect (Using F12). But When I click on any button on second page then it give me first page studentID.

grid.appScope is working only first Page. It is not working on other pages (rendering perfect but on click give wrong id).

How to solve this issue?

Python Boy · Answer 1 · 2016-08-09T13:07:39.990

0

It will be easy to understand if you create a plunkr. As of now I can just suggest that using browser inspect tool, try to check if that template is still present on the 2nd page as well

edited Aug 09 '16 at 13:07

answered Aug 09 '16 at 13:02

Python Boy

161
1
2
12

I will add next 48hours. It take some time. – user2960398 Aug 09 '16 at 13:03
as of now I can just suggest that using browser inspect tool, try to check if that template is still present on the 2nd page as well – Python Boy Aug 09 '16 at 13:07
Yes, cellTemplate on every page and rendering perfect. But when click then it is give me first page cellTemplate ID. I have also checked it is not give me row index instead of studentID. – user2960398 Aug 09 '16 at 13:13

user2960398 · Answer 2 · 2016-08-10T05:32:03.937

When I was create plnkr link for my problem during issue solved.

There was syntax problem like

 var statusTemplate = '<button type="button" class="btn btn-default" ng-click="grid.appScope.add(lg,row.entity.StudentID)">Add</button> ';

row.entity.StudentID instead of {{row.entity.StudentID}}

{{row.entity.StudentID}} syntax had not worked on plnkr after that I have tried this row.entity.StudentID and my issue is solved.

Here working link : http://plnkr.co/edit/J8aDQR?p=preview

grid.appScope is not working with paging

2 Answers2