Questions tagged [angular-ui-grid]

angular-ui-grid is a datagrid written in AngularJS by the AngularUI Team. This is the 3.x version of the former ng-grid. It is a high-performant datagrid using virtualization for rendering rows and really shines when you have lots of rows.

UI Grid is a datagrid written in by the AngularUI Team, no jQuery.

It is a high-performant datagrid using virtualization for rendering rows and really shines when you have lots of rows.

1895 questions
15
votes
4 answers

ng-click inside cell template does not trigger function in controller

I have created a plunker here: http://plnkr.co/edit/zGqouwzxguef13lx48iP?p=preview When I click in a cell of the ui-grid in the day view then nothing happens. What I expected is that the test function is executed and an alert is shown with text…
Pascal
  • 12,265
  • 25
  • 103
  • 195
15
votes
6 answers

Conditional cell template in ui-grid angularjs

How to add conditional when showing data in ui-grid cellTemplate below: $scope.status = ['Active', 'Non Active', 'Deleted']; $scope.gridOptions = { columnDefs: [{ field: 'code' }, { field: 'name' }, { field:…
Hendra
  • 519
  • 4
  • 8
  • 15
14
votes
2 answers

angular ui-grid selecting all under grouping

https://jsfiddle.net/4byyuqtc/1/ I'm looking to have the ui-grid select all "children" under a grouping when the grouping line is selected. In this case Kit Kat(1), Mr. Goodbar(1), Krackel(2) and ultimately selecting the actual records (the non…
user441521
  • 6,942
  • 23
  • 88
  • 160
14
votes
4 answers

Using a function in cell template

I am using angularjs with ui-grid. One column of the grid contains a timestamp that I would like to render as a properly formatted date. Up to now, I tried like this but the function is never called. $scope.formatDate = function(date) { return…
Arnaud Denoyelle
  • 29,980
  • 16
  • 92
  • 148
14
votes
7 answers

UI-Grid does not take 100% width on page load

I am using ui-grid to showing data in table. when i load the page and leave for few second and then click on the tab (which containing ui-grid), the ui-grid css break. it does not show width of ui-grid 100% of container.but when i load page and just…
Mukund Kumar
  • 21,413
  • 18
  • 59
  • 79
13
votes
3 answers

Row wise tabindex lost focus after few continuous tabs

I have an ui-grid with just 1 column and about 1000 rows. Each row have a textbox in it. I want to navigate through textbox by tab. This works fine about 10 - 15 rows, after that the textbox is losing its focus, then if you press tab again, it will…
Amir Suhail
  • 1,284
  • 3
  • 12
  • 31
13
votes
5 answers

Angular JS UI-Grid Delete Row

I'm new to ui-grid and I'm trying to implement a table in AngularJS as shown in the picture below. I'm trying to select a row and delete it using a delete button on that particular row. The ui-grid documentation requires us to use the gridApi but I…
Sur
  • 133
  • 1
  • 1
  • 7
13
votes
4 answers

Is paging and columnResizing not working in ui-grid v3.0.0-rc.11

I can't seem to get any paging or column re-sizing working in the new ngGrid (ui-Grid) rc build v3.0.0-rc.11. It should be really straight forward according to this example: http://ui-grid.info/docs/#/tutorial/401_AllFeatures For my main div, if I…
smackenzie
  • 2,880
  • 7
  • 46
  • 99
12
votes
1 answer

angular ui-grid custom header html

I'm trying to add a glyphicon glyphicon-thlist (that I can click and call a controller function) to the left hand side of the default header. I took the default header and trying to manipulate it to do this. The default header is located:…
user441521
  • 6,942
  • 23
  • 88
  • 160
12
votes
2 answers

UI GRID insanely fast vertical scroll issue

I used UI Grid in my project and below is a snapshot of the gridOptions variable that I used. The Problem is everything was working fine. But from past 1 or 2 weeks the vertical scroll is insanely scrolling on just a single scroll. Since multiSelect…
digender mahara
  • 467
  • 3
  • 15
12
votes
5 answers

Format footer values in ui-grid

How do I format the aggregate value for a column in ui-grid? With my numbers I get something horrible like total: 6370.046074130321 when I would like total: $6370.05 I tried both: footerCellTemplate: '
DeclanMcD
  • 1,518
  • 4
  • 22
  • 41
12
votes
2 answers

How to use Angular UI-Grid with Server Side Paging

I'm using AngularJs Ui-Grid.info to display dynamic data grids, I love it but now I have to hook it up to a database table with 60,000 records using server-side filtering and paging and it appears that the pagination options for this plugin is only…
David Cruwys
  • 6,262
  • 12
  • 45
  • 91
12
votes
4 answers

Angular ui-grid events in cell header not firing

I'm using a headerCellTemplate in the columDefs of my ui-grid (not ng-grid but the new rewrite). In the html I have a checkbox. Essentially I am trying to add a checkbox in the header of a column that is all checkboxes so I can check all/none. The…
Scott
  • 1,690
  • 3
  • 13
  • 18
11
votes
4 answers

angular-ui-grid: how to highlight row on mouseover?

I want to highlight an entire row of angular-ui-grid when the mouse is on top of it. I have tried to modify the rowTemplate by adding ng-mouseover and ng-mouseleave callbacks which set the background-color. Here is my rowTemplate--I expect the…
ethan
  • 173
  • 1
  • 1
  • 9
11
votes
2 answers

Disable filtering for a specific column in UI-Grid

I have a column in my grid which is contains several buttons. I want to only disable the filtering feature in that column. For example, filtering should be available in office phone but It has to disable in Actions column. I want to remove the…
Mahdi
  • 1,777
  • 4
  • 24
  • 48