Search Posts

Category: angular-ui-grid

UI-Grid : Color row based on cellclass

I have a requirement where I am applying conditional formating to date-times, so if the date have passed I assign .red css class to it, if it almost passed (less than 90000ms) I assign .orange otherwise its .green. I managed to get this working by I can;t figure out how to color the entire row instead of just the cell. If someone can help me re-write this as a RowTemplate or have an idea how […]

How to cancel cell editing in Angular ui-grid?

I have some condition in beginCellEdit event gridApi.edit.on.beginCellEdit($scope, function(rowEntity, colDef, event) { var scope = angular.element(event.currentTarget).scope(); var selectedRowIndex = scope.rowRenderIndex; var selectedColumnName =; if ($[selectedRowIndex-1][selectedColumnName].trim()==”) { alert(“You cannot enter the value in this cell”); // At this place I want to cancel edit and return focus to grid } }) Is there any preventDefault or similar method so can easily cancel the cell editing and return focus to grid. Thank you! Source: AngularJS

AngularJS UI-Grid preserved state

I need to make a preserve state in AngularJs when i go from a page to another page and come back, the functionality i have created, but the problem is with ui-grid. When i come back to the page with ui-grid table i need that all the fields which i filled to be filled back with the data. I have the data but i don’t know how to access the filters input. Here the filters […]

How to disable restoring selections on AngularJS UIGrid

I have a non-angular web application. I must add an angular page to that application using the UI Grid. I am saving the state of the angular page when navigating away from angular. I am restoring that state when I return to the page using this documentation: However, the non-angular page changes the “selected” rows of the angular page. I must manually manage that and disable saving/restoring the selected rows. It appears that adding […]

ui-grid cellTemplate images not displaying

I am upgrading from ng-grid to ui-grid for an angularjs itunes app and I’m having some difficulty getting album image and view icon to display inside my ui-grid, it seems to have trouble binding to the img tags. The View icon should be linked to a url (see below). inside my $scope.gridOptions… {field: ‘View’, displayName: ‘View’, width: 60, cellTemplate: ‘<div class=”ui-grid-cell-contents ng-binding ng-scope” ng-class=”col.colIndex()”><a ng-href=”grid.getCellValue(row, col)”><img ng-src=”” height=”30px” width=”30px” lazy-src /></a></div>’}, {field: ‘AlbumArt’, displayName: ‘Album […]

How to sort items under grouped list in ui-grid

I have list of State and City in grid. I am grouping by State. It is working fine. But i want City to be sorted under grouped list when i click on State sort. How can i do this?. Now only when I click sort on City it is sorting. I want to sort city also when sort for State is clicked. Here is the plunker, here is my code, var app = angular.module(‘app’, […]

Angular ui-grid adding new row dynamically

I am having a problem with the newly added row. It inherit the row in the grid (the buttons and behavior). The code is working adding a new row but I want a new row with the behavior in the AddOverride() function. Like a button with save and cancel button. Also when I add a new row. the new row >has the update and delete button. When I try to click update on the newly […]

RowTemplate gets overriden by Cell Template in UI-Grid

I have an ui-grid that sets the background color of each row based on the value of one of the data fields. One of the columns is a boolean that I’d like to show as a checkbox. The rows get colored as desired except in the first column, the checkbox. If I remove the column celltemplate instruction, it works (the cell gets colored) so Im guessing my checkbox template is not accurate or that it […]

Next Page »