FAQ Database Discussion Community


Copy angular-ui-grid fonts into .tmp/fonts

angularjs,fonts,gulp,angular-ui-grid
I was experiencing a known issue with Angular UI Grid where some of my fonts would look Korean in production. I applied a certain fix by adding the following CSS: @font-face { font-family: 'ui-grid'; src: url('../fonts/ui-grid.eot'); src: url('../fonts/ui-grid.eot#iefix') format('embedded-opentype'), url('../fonts/ui-grid.woff') format('woff'), url('../fonts/ui-grid.ttf?') format('truetype'), url('../fonts/ui-grid.svg?#ui-grid') format('svg'); font-weight: normal; font-style: normal; }...

Angular UI-Grid 3.0.0-rc.16: Pagination not working for me

javascript,angularjs,pagination,angular-ui-grid
I have a very simple grid and am trying to enable pagination, but paging controls do not appear. Here's what I have: I have added 'ui.grid.pagination' as a dependency on my app module. html: <div ui-grid="gridOptions" ui-grid-selection ui-grid-pagination external-scopes="$scope" class="campaigns-grid"></div> js: $scope.gridOptions = { data: 'campaigns', enableRowSelection: true, noUnselect: true,...

ui-grid : directive as cellTemplate

angularjs,angularjs-ng-repeat,cell,angular-ui-grid
I'm using ui-grid with the following data structure : { name: String, tags: [{label: String, image: String}] } So the grid would have 2 columns : name and tags. A row entry can have multiple tags associated to it (hence the Array). Each tag has two properties : a label...

angular ui-grid disable edit for view mode

angularjs,angular-ui-grid
is there a way to disable/enable cell edit of the grid. for example i have a master-detail form screen. when user wants to analyze a record, i disable all controls of the form with ng-disabled. but i could not prevent editing the grid. i tried "cellEditableCondition" option. But, i runs...

Remove aggregation menu items from angularjs ui-grid menu

angularjs,angular-ui-grid
The ui-grid example on the official website ( http://ui-grid.info/docs/#/tutorial/209_grouping ) presents a grouping feature, which looks like this: I would like to have the Grouping menu item, but not have the Aggregate ones (count, sum, max, min, avg) in the column menu and I couldn't find a way around removing...

Disable Angular UI Grid column menu animation

angular-ui-grid
When I click on an Angular UI Grid column's arrow icon to show the dropdown menu for that column, then click the arrow icon again to hide it, the menu "shoots" up in an animated fashion, which I find undesirable. How can I disable this behavior?...

Angular ui grid double click event setup

angularjs,angular-ui-grid
So I'm trying to get my Angular UI Grid to register a double click event on an entire row to open up a modal. I can start with a toastr toast and go from there though. This is the closest I've come based on various demos and examples online, but...

How do I apply styling to sorted columns in Angular ui-grid?

angularjs,sorting,styling,angular-ui-grid
I have a ui-grid with some narrow columns and when I apply a sort to these columns, the little arrow that indicates the sort and its direction doesn't show. So I'd like to be able to style the column cells, or just the column header, according to the column sort...

ui-grid angularjs checkbox button not being resorted

angularjs,angular-ui-grid
grid angularjs i have a checkbox column after i check one column and sort with other column example age the active column is not being resorted this is a plunkr of the pbm "http://plnkr.co/edit/Q3Fs3XiRBpqkzKdZlGXW?p=preview" <!doctype html> ...

Error 'uiGrid' must have exactly one root element. ui-grid/ui-grid when UI-Grid is initiated

angularjs,gruntjs,ng-grid,angular-ui-grid
While trying to add ui-grid to an angular project, I came across this issue. I’ve bootstrapped the angel;ar application with ui-grid dependency injected. var app = angular.module(‘myApp’,
 ['ui.bootstrap',
 'services',
 'filters',
 'directives',
 'controllers',
 'ui.grid'
 ]); The controller looks like this. angular.module('controllers').controller('UIGridCtrl',function UIGridCtrl($scope) {
 $scope.init = function(){
 $scope.myData = [
 {"firstName": "Cox",...

Angular UI Grid, adding a button to a row cell via templating

angularjs,angular-ui-grid
I got the following gridOptions.columnDefs $scope.generateReport = function(row) { alert("Test"); }; $scope.gridOptions.columnDefs = [ { name: 'Action', cellEditableCondition: false, cellTemplate: '<button ng-click="grid.appScope.generateReport(row)"> Report </button>' }]; It's not working, the button shows but once clicked its not calling the function. I'm following their guide Here, and I'm using ui-grid - v3.0.0-RC.18....

Setting filters in ui-grid doesn't work

angularjs,angular-ui-grid
I am trying to set the filter in ui-grid pragmatically but doesn't seem to work with ranges. This plunkr shows one of the filters working perfectly (the name). But the age filter populates the input box but doesn't appear to update the grid's filter. Do I have to manually update...

angular ui-grid grid height/rows visible

javascript,angularjs,angular-ui-grid
I am using angular ui-grid. I would like to set the height of the grid's contents or the number of rows visible. Ideally, I would like this to set dynamically based on the window size, but, will settle for hard-coding it for now. All of the grids in the ui-grid...

Can't get ui-grid to work in bootbox custom dialog

angularjs,angular-ui-grid,bootbox
I'm using AngularJS, UI-Grid (http://ui-grid.info/), and Bootbox for a project. What I'd like to do is have the user click a button on the screen, and bring up a dialog box where they select an item from a UI-Grid table. I put together the simplest example I could make: http://plnkr.co/edit/YvsiAQhUrNqnSse1O0oh?p=preview...

When a dialog that is bound to a datagrid cell is cancelled how to revert the bound data

angularjs,angular-ui-grid
I am using angular with angular ui-grid and angular-modal-service + bootstrap. The data in my ui-grid is also bound to my dialog which opens when the user double-clicks into the datagrid`s cell. When the user changes data in the dialog it is also changed in the datagrid. When the user...

Angularjs Ui grid grouping formatting is needed

angularjs,angularjs-directive,angular-ui,angular-ui-bootstrap,angular-ui-grid
I am using Angularjs ui grid grouping functionality. Please see the image, When displaying group sum, by default it is getting displayed as 'total :' but I want to change it to 'Total' (capital 'T') and also I want to restrict aggregated totals to 2 decimal numbers. Where I need...

UI-GRID Height Of Grid Percentage Of The Screen Area

angularjs,angular-ui-grid
What is the best way to handle the height of the ui-grid. We want to have it take up 85 percent of the screen and the footer take up 15%. Whey I set the height of the grid to 85%, it doesn't do anything. When I change the px height,...

AngularJS UI-Grid Programmatically set dirty flag for saving in rowEdit feature

angularjs,angular-ui-grid
I have an AngularJS UI-Grid with rowEdit feature enabled. I need to programmatically notify that a row changed value and need to be saved (because this change was made to the model externally to the grid). How can this be achieved? For references: http://ui-grid.info/docs/#/tutorial/205_row_editable Thank you...

sortInfo does not work

ng-grid,angular-ui-grid
I am trying to display data from table in sorted way. I want to display content ordered by creation date. I add sortInfo, but it does not work! I use angular ui-grid. Here is my code $scope.gridOptions = { enableSorting: true, columnDefs: [ { field: 'name'}, { field: 'age'}, {...

How to filter with multiple values in ui-grid? (angularjs)

javascript,angularjs,angularjs-filter,angular-ui-grid
I'm trying to make a filter with passing multiple values for the filter but have only a single return. field: 'name', filter: { condition: function(searchTerm, cellValue) { var strippedValue = (searchTerm).split(';'); //console.log(strippedValue); for (i = 0; i < strippedValue.length; i++){ if (cellValue.indexOf(strippedValue[i]) == -1) return false; return true; } //return...

Edit ui-grid cell value using protractor

angularjs,testing,protractor,angular-ui-grid,end-to-end
I am using protractor to test angular 1.3.13 and ui-grid 3.0. All cells in grid are editable. In my tests I can get cell using following method: dataCell: function( gridId, fetchRow, fetchCol ) { var row = this.getGrid( gridId ).element(by.css('.ui-grid-render-container-body')).element( by.repeater('(rowRenderIndex, row) in rowContainer.renderedRows track by $index').row( fetchRow ) );...

Angular ui grid - specific class for unselectable row

angularjs,angular-ui-grid
I use angular ui-grid to display my data. I enabled the option to select row in gridOptions: enableRowSelection: true, But for specific rows I disable the selection by this code: $scope.mygrid.isRowSelectable = function (row) { if (row.entity.id == 2) { return false; } else { return true; } }; This...

how to reuse ui-grid external pagination and sort methods?

javascript,angularjs,angular-ui-grid
I'm trying to use ui-grid with external pagination and external sort in a project. how can i modify ui-grid once and use it several place?

How to get notified when grid changed in AngularJS ui-grid?

javascript,angularjs,angular-ui-grid
If there is a way in ui-grid that I can know a grid is finish updating the rows?(like a filter is being applied etc)? I want to run some function after the grid view changes. I tried the following method: $scope.filteredRows = $scope.gridApi.core.getVisibleRows($scope.gridApi.grid); $scope.$watch('filteredRows', function(){console.log('view updated');}); The above approach works...

Dropdown menu in angular ui-grid column not dropping down

angularjs,angular-ui-grid
I am trying to insert a dropdown menu into a column in ui-grid. Each menu item will have an ng-click attached. I am using ui-grid-unstable.min.js because pagination doesn't seem to work in ui-grid-stable.min.js The button appears in the grid and registers that it has been clicked on (the open class...

Dynamically update an object shared between two uiGrids AngularJS

angularjs,angular-ui-grid
I have two uiGrids on a page each one actually relies on the same source of data, and a filter is used on one of the columns in each grid to decide which items should appear in which grid, the idea is that if I want an item to appear...

How to make Angular ui grid expand all rows initially?

angularjs,angular-ui,angular-ui-grid
I am using ui grid to show a list of data and I am trying to initially expand all rows. I am trying to do this in the onRegisterApi event: scope.GridOptions = { data: properties, columnDefs: [ { name: "Full Address", field: "FullAddress" }, { name: "Suburb", field: "Suburb" },...

How do I center a button in an angular-ui-grid cell?

css,centering,angular-ui-grid
I define a column as follows: { name: 'button', displayName: '', cellClass: 'ui-grid-vcenter', enableColumnMenu: false, enableFiltering: false, enableSorting: false, cellTemplate: '<div><button ng-click="grid.appScope.rowButtonHandler(row.entity.id)">clicky</button></div>' } Resulting in: <div class="ui-grid-cell ng-scope ui-grid-coluiGrid-010 ui-grid-vcenter" ui-grid-cell="" ng-class="{ 'ui-grid-row-header-cell': col.isRowHeader }" ng-repeat="(colRenderIndex, col) in colContainer.renderedColumns track by...

Dynamically change gridOptions columnDefs

angularjs,angular-ui-grid
In the following plunkr I want the Gender dropdown filter to be populated dynamically by the ajax call, but it doesn't appear to work. plunkr link If I comment out line 17 $scope.newSelectOptions=[{"value":"New Item 1","label":"New Item 1"},{"value":"New Item 2","label":"New Item 2"},{"value":"New Item 3","label":"New Item 3"},{"value":"New Item 4","label":"New Item 4"}]; it...

AngularJS, ui-grid

angularjs,angular-ui-grid
is there anyone who knows how to disable this white space after rows inside grid ? I would like it to match number of rows and make it sticked. No white space needed there....

Angular UI Grid click row

angularjs,angular-ui-grid
I have a list of items in an Angular UI Grid. When I click a row, I want to be taken to a different page. (In other words, each row in the grid will be a link.) I imagine this must be a very common desire, although I haven't really...

Angular Ui grid Coloumndefs bug

javascript,angularjs,ng-grid,angular-ui-grid
When i am using the following code, this is working fine <!doctype html> <html ng-app="app"> <head> <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.26/angular.js"></script> <script src="ht tp://ajax.googleapis.com/ajax/libs/angularjs/1.2.26/angular-touch.js"></script> <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.26/angular-animate.js"></script> <script src="http://ui-grid.info/docs/grunt-scripts/csv.js"></script>...

UI Grid CSS not working

css,angularjs,twitter-bootstrap,ng-grid,angular-ui-grid
I tried to create a grid using UI grid (Recent version of ngGrid) which is unstable version and integrated in my current project. It is Not correctly displaying the (icon angle down and row selected icon) as needed While including the CSS file in project (by downloading the file and...

angular ui-grid grouping header

javascript,angularjs,angular-ui,angular-ui-grid
i am trying to make the group headers to be shown as the cellTemplate, this is the template i use: <div class="ui-grid-cell-contents"> <div ng-show="COL_FIELD"> <i class="ace-icon fa fa-check bigger-110 green"></i> </div> <div ng-hide="COL_FIELD"> <i class="ace-icon fa fa-times bigger-110 red"></i> </div> </div> and this is the columnDefs: { name:'active', width: 100,...

UI-GRID Single Input Filtering

angular-ui-grid
Whats the best way to handle grid filtering with one input. Is there a simpler way then dealing with it this way: http://ui-grid.info/docs/#/tutorial/321_singleFilter I also want to filter with every keystroke, not click a button. Thanks...

selectedItem in ui-grid 3.0.0

angularjs,angular-ui-grid
I'm currently testing angular ui-grid 3.0.0. Following sample code from older version, the selectedItems should contains some object when selected. In version 3, it doesn't seems to work. Anybody have encounter the same behaviour? Angularjs version: 1.3.11 Angular-ui-grid: 3.0.0-rc.16 here are some extract code from my controller: $scope.gridOptions = {...

Angular ui-grid add a row and enter Edit mode

angularjs,ng-grid,angular-ui-grid
I would like to have a button that adds an object to the data array of an ng-grid 3.0. When this row is added I would like to enter edit mode of that row. I tried to do this with gridApi.core.on.rowsRendered However it calls every time the rows are rendered...

Format footer values in ui-grid

angularjs,angular-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: '<div class="ui-grid-cell-contents" >{{COL_FIELD | currency}}</div>', and footerCellTemplate: '<div class="ui-grid-cell-contents" >{{grid.getCellValue(row, col) | currency}}</div>', but none of them work....

UI-GRID - Convert A Cell To Date Format

angular-ui-grid
Is there a way in UI-GRID to convert the column from a long value to a Date String? Is there a way todo this without having to loop through each value?...

Showing readable data in ui-grid with editable drop-down cell

angularjs,ng-grid,angular-ui-grid
I have a editable angular-ui-grid, where my editable column in columnDefs object is defined as columnDefs: [ { name: "rightslist", displayNameKey: tr.rightsList, editableCellTemplate: 'ui-grid/dropdownEditor', editDropdownOptionsArray: [{name: 'Read-Only', value: 1}, {name: 'Read-Write', value: 2}], editDropdownIdLabel: 'value', editDropdownValueLabel: 'name', enableCellEdit: true }] The drop-down shows just fine showing me "Read-Only" and "Read-Write",...

Angularjs ui grid with grouping column sequence is getting jumbled up

angularjs,angularjs-directive,angular-ui,angular-ui-bootstrap,angular-ui-grid
I am using AngularJs ui grid with grouping. The table is displaying fine but the problem I am facing is that the months sequence in the table is getting jumbled up. Please find my Plunker. In the table the Months are appearing in the jumbled up sequence 11-14, 05-15, 04-15,...

Angular Grid Validation on cell value

javascript,angularjs,angular-ui-grid
How would I highlight a cell be colored red if gender == "male" instead of a row. This code currently highlights the whole row, but I want it to highlight only a particular cell. This code is taken from this UI Grid tutorial. var app = angular.module('app', ['ngAnimate', 'ngTouch', 'ui.grid',...

How to get the filtered rows in ui-grid?

javascript,angularjs,angular-ui-grid
Using ui-grid I want to get a list of all the filtered data rows using the filter. In the plunker below I have the original data of 500 items filtered down to 61. Now how do I get a list of those 61 entities? plnkr link If I use the...

How to animate Angular ui-grid when rows are added

angular-ui-grid
I have an Angular UI Grid element. I am periodically adding new items at the front of the data array. I'm only adding a few at a time (like 1 to 5 new items) I would like the UI Grid to animate the new rows being added. Right now the...

how to turn off ui-grid column header formatting

angular-ui-grid
so, I have this column definition for my ui-grid columnDefs: [ { name: 'Usr#', field: 'userNum', width: '*', resizable: true}, { name: 'Name', field: 'userName', width: '*', resizable: true}, { name: 'PID', field: 'userPID', width: '*', resizable: true}, { name: 'Flags', field: 'userFlags', width: '*', resizable: true}, { name: 'Blk...

How to get column footer data in Angular UI-Grid?

javascript,angularjs,angularjs-directive,angularjs-scope,angular-ui-grid
For example, in this tutorial, if there is any way to get the data in the column footer? I'd like to present the total numbers in somewhere else. Thanks in advance....

angular ui-grid get name of column to be sorted

javascript,angularjs,angular-ui-grid
How do you get the name of the column that is supposed to be sorted? I need to pass this information to my function that gets data to achieve external sorting.

UI Grid Angular, grid renders but doesn't display data

angularjs,angular-ui-grid
What am I missing here? The grid renders with no errors, blank rows... I checked and JSON is coming in fine up to this point $scope.gridOptions.data = response['data']; It seems like its rendering the empty array and never getting to the actual data... app.controller('MainCtrl', ['$scope', '$http', function ($scope, $http) {...

Angular UI-Grid How to filter by display value instead of actual value?

angularjs,angular-ui-grid
I have a gender column in my grid and its actual value is a integer and it gets transformed into strings such as Male, Female etc... Filtering won't work if I try to filter it by the text, filtering by actual integer value works fine. How can I filter it...

How to get angular ui grid footerTemplate to work?

javascript,angularjs,footer,angular-ui-grid
Angular UI-Grid has a property called footerTemplate, which is supposed to offer the possibility to create a custom footer template. I tried entering html content (a div with some text) in a string, I've also tried adding a .html file name in the string and even the ID of a...

How can i add the serial number to rows in Angular ui gird

angularjs,angular-ui-grid
I am using this for my angular grid http://ui-grid.info/ and i want to add serial numbers to all rows. I tried this {name: 'ID', field: '', displayName: 'Row Number', cellTemplate: '<div>{{row.rowIndex + 1}}</div>'}, But it keep showing on 1 in the column. Lool like row.rowIndex is not giving returning anything....

How to show column footer in grouped grid in AngularJS ui-grid?

css,angularjs,angularjs-directive,angular-ui-grid
I'm using AngularJS ui-grid and followed this tutorial to show the column footer of the gird, it worked fine. However, after I added grouping function in the grid, the column footer is disappeared. From the 105_footer tutorial, I used this to aggregate column values: aggregationType: uiGridConstants.aggregationTypes.SUM In the grouping's column...

Add code to a function in angular programmatically

javascript,angularjs,angular-ui-grid
I want to add code to a function that is inside of ui-grid. I do not want to edit the existing code. How can I add code to an existing function, in angular, that does not edit the original code? I tried using the concept from Adding code to a...

Missing CDN link for ui-grid

ng-grid,angular-ui-grid
Having had a good Google, I can't seem to find a CDN link for ui-grid ... is there a reason it's not on a CDN?

Can't add bower component css into assets pipeline in Rails 4.2

css,ruby-on-rails,angularjs,asset-pipeline,angular-ui-grid
I'm trying to add bower component (angular ui-grid) to my angularJS + Rails 4.2 application. The component is working fine in development env, but in production env it works without its css. I've installed the component via a bower to vendor/assets/bower_components and made the following changes in order to integrate...

Updating Model in Angularjs

angularjs,angular-ui-grid
Here is the plnkr : http://plnkr.co/edit/s9MwSbiZkbwBcPlHWMAq?p=preview If I add information twice, latest data are the same, how can I prevent model from updating? $scope.personList = []; $scope.newPerson = {}; $scope.columns = [{ field: 'Name' }, { field: 'Country' }]; $scope.gridOptions = { enableSorting: true, columnDefs: $scope.columns, onRegisterApi: function(gridApi) { $scope.gridApi...

Retrieve data without _id and _ref from coucgdb

json,angularjs,couchdb,angular-ui-grid
I have a database with lots of document and i am using field type to define it as a table. I want to populate angularjs ui-grid with the JSON data coming in value. So i have created a view: function(doc) { if(doc.type === 'userTable'){ emit(doc._id, {userName:doc.userName,fName:doc.fName}); } } When i...

UI-GRID Expandable Grid. Programatically expand one row

angular-ui-grid
I want to hide the + icon in the far left column and add another icon. When the user clicks the new Icon I want to programatically expand that specific row. I see there is gridApi.expandable.expandAllRows(); Is there a way to expand just one row?...

Column header wrapping when using Angular ui-grid

angularjs,ng-grid,angular-ui-grid
I have upgraded my AngularJS SPA application from ng-grid v2.0.7 to ui-grid v3 and my column headers no longer wrap around. My column headers are now single lined and show an ellipsis ... when the column header doesn't fit. Has this feature been removed or is had it been superseded...

angular ui-grid pagination v3.0.0-RC.18 not working

javascript,angularjs,angular-ui-grid
How do you get pagination to work/controls to appear using angular ui-grid? Has anyone successfully done it? I am aware of the tutorial. Things I've tried that haven't worked: Using the tutorial as a guide. Remaking the example outside of my project. Using different versions of ui-grid; I've tried RC.12...

Vertial column heading text in ui-grid

css,angularjs,css3,angular-ui-grid
I'm trying to write a angular ui-grid (the new ng-grid) with vertical text in the column headings but having some interesting results using the standard CSS trick .blue { color: blue; transform: rotate(90deg); transform-origin: left; height:100px; } http://plnkr.co/edit/CtDEcgSrebLFnBXcMrjS?p=preview I just wondered if this were possible and if anyone had any...

Sharing $scope with cellTemplate using ui.grid

javascript,angularjs,angular-ui,angular-ui-grid
I'm using ui.grid to get a list of parts. I've created a column that contains a button which launches a modal. What I'm having trouble with is sharing the scope of the part that is contained in the row. I want to share the properties of that row with the...

UI-grid set column order

javascript,angularjs,angular-ui,angular-ui-grid
I am trying to set the initial column order for ui-grid from data that I am getting from an $http call. When configuring gridOptions.colDefs it does not appear that any properties exist for me to set with initial order. How do I go about setting the initial column order for...

How to format a number value in AngularJS ui-grid cell to two decimal?

angularjs,angularjs-directive,number-formatting,angular-ui-grid
I'm using Angularjs ui-grid and using the default settings, the question is how can I format the numbers to two decimal? ...

How to do filtering in AngularJS ui-grid when using Grouping?

javascript,angularjs,angularjs-directive,angularjs-scope,angular-ui-grid
I just added Grouping function in my ui-grid, but then I found that the filtering function is broken. It happends in the official tutorial. In the example, no matter what you type in the filter box in the demo, nothing will change in the grid. So for example, in that...

$scope issue with gridOptions, angular-ui-grid and REST call from service

json,angularjs,angular-ui-grid
I seem to be having an issue getting my ng-grid directive to populate from a returned REST api json obj. I have verfied that a valid json obj is returned and i have retrieved a nested obj of the data I need. It seems that it is not making it...

Header-templates in UI-Grid 3.0

angularjs,angular-ui-grid
I would like to create two header rows with Angular UI-Grid 3.0. This is how it was done in ng-grid 2.0: http://plnkr.co/edit/i261iOpP2PdfGgg3C6ng?p=preview With the newer grid, it appears to work at first, but if you click on any of the sorting columns the header size increases. Is there a work...

ui-grid using external Pagination and exporting data

angularjs,pagination,export-to-csv,angular-ui-grid
I am currently using ui-grid implemented with external pagination to display my data. I've run into as issue where I can only export the currently viewed data, however I need to be able to export ALL data as well. Anyone know a work around to export all data using external...

Angular ui-grid row selection call function

angularjs,angular-ui-grid
I am adding a ui-grid and want to be able to select a row and call a function. I also need to send to the function the data from the entire row (only a couple of columns are actually displayed), however I need the complete row passed to the function....

angular ui-grid 3.0 get selected rows

angularjs,angular-ui-grid
This answer states that this code: $scope.gridOptions.onRegisterApi = function(gridApi){ $scope.gridApi = gridApi; $scope.mySelectedRows=$scope.gridApi.selection.getSelectedRows(); } Should work in order to get the selected rows, but to me it returns always [], to get track of selected rows I have to call gridApi.selection.getSelectedRows() each time a selection event is triggered, is this...

UI-GRID - Dynamic Row Height - Alternatives

angular-ui-grid
I tried to get a cell to expand it's height dynamically. Is there a way to adjust the height of a row(GridRow) after it is rendered? If not, then I will try to use an expandable grid or tree in a grid. Is it possible to display an expandable grid...

Can you change ui-grid fonts?

javascript,css,fonts,angular-ui-grid
Is it possible to change the fonts used in ui-grid? I know out of the box it requires 4 font files: ui-grid.eot, ui-grid.svg, ui-grid.ttf, and ui-grid.woff I want to use these font files instead: glyphicons-halflings-regular.eot, glyphicons-halflings-regular.svg, glyphicons-halflings-regular.ttf, and glyphicons-halflings-regular.woff I tried just replacing the font files in the ui-grid-unstable.min.css file...however...

Not able to display ui-grid in ui-bootstrap modal windown

angularjs,twitter-bootstrap,angular-ui-grid
[SOLVED] I figured this out. The issue is related to modal sizing, if you resize the window the grid will be displayed. Adding auto-resizing directive solved the problem. See more details at http://ui-grid.info/docs/#/tutorial/213_auto_resizing I have the impression that there is some sort of conflict between the grid's style and bootstrap...

UI-GRID header - Change Color And Text

angular-ui-grid
I want to change the color and text of the angular ui-grid header. I want the background of the header to be black and the text to be white. I don't want gradiant or shading. I just want it black. What CSS do I need to add? Thanks...

How to access ui grid row data in expandable row template?

angularjs,angular-ui-grid
I am trying to implement an expandable ui grid with customized expandable template. How can I access the row data in the template? In the controller, I defined the grid options like this: scope.GridOptions = { data: customers, columnDefs: [ { name: "FirstName", field: "FirstName", width: 130 }, { name:...

Angular ui-grid. Error in example?

angularjs,tree,grid,angular-ui-grid
I want to use ui-grid with treeView, but in example: http://ui-grid.info/docs/#/tutorial/215_treeView it working wrong. if i click on "+" icon and then click "-" icon - last row going out from grid. How repear this, or replace to other grid with tree (hierarhical grid with several column and row selections)?...

UI_GRID Expandable Grid Change Row Colors

css,angular-ui-grid
How do I change the row colors for an expandable grid? I am using this for the Main grid, which works great. .ui-grid-row:nth-child(odd) .ui-grid-cell { background-color: #E3E3E3; !important; } .ui-grid-row:nth-child(even) .ui-grid-cell { background-color: #FFF; !important; } But this is not being picked up by the subgrid. Thanks...

Angular UI Grid filter only applies to beginning of cell value

angularjs,angular-ui-grid
I'm using an Angular UI Grid in my app. I set enableFiltering to true in the options which made some filter boxes show up above my columns. This is great, but the filters don't work exactly as desired. If a cell contains the text "I like pizza" and I type...

is there a stable version for UI Grid?

angularjs,ng-grid,angular-ui-grid
I only find the unstable version of UI Grid on the web. Is there a stable version already available or coming out any time soon?

Define column position in Ui grid Angular

angularjs,angular-ui-grid
here's how i defined one of my col in Ui grid : getDeviceTypeList = function () { BaseInfoService.getDeviceTypeList().then(function (data) { debugger; $scope.deviceTypeList = data; $scope.gridOptions.columnDefs.push( { headerCellTemplate: '<div>{{"common.DeviceType"|translate}}</div>', cellTemplate: '<div>{{getExternalScopes().deviceTypeFormatter(row.entity.DeviceTypeCode)}}</div>', field: 'DeviceTypeCode', enableCellEdit: true, editType: 'dropdown', editDropdownOptionsArray: $scope.deviceTypeList,...

Cannot use InfiniteScroll feature of ui-grid

angularjs,infinite-scroll,angular-ui-grid
Trying to use, without success, infinite scrolling feature of ui-grid. Both 3.0.0-v16 and current unstable script version (released 2 days ago) were used. I'm following the example of http://ui-grid.info/docs/#/tutorial/212_infinite_scroll . When ui-grid calls $scope.gridOptions.onRegisterApi(gridApi) method, the injected gridApi object does not have a infiniteScroll member. Indeed, the following line gridApi.infiniteScroll.on.needLoadMoreData($scope,...

How to get angular ui-grid remaining columns to resize after one column width is resized manually?

javascript,angularjs,angular-ui-grid
After resizing a coulmn to be smaller I want the remaining columns to adjust their width to take up the entire space of the grid. There should never be any white space. How do I achieve this behavior? The behavior I want is on this demo from ui-grid: http://ui-grid.info/docs/#/api/ui.grid.resizeColumns.directive:uiGridColumnResizer Currently...

Nested Grid Example - Different Columns

angularjs,angular-ui,angular-ui-grid
I am using the latest version of ui-grid ui-grid.info. What is the best way to handle nested grids with the possibility of the nested child grid having different columns then the parent row....