angular-ui-grid

I am using the Angular UI Grid to display some data. Sorting is enabled and initialized as well as selecting a single row: vm.gridOptions = { enableSorting: true, enableRowSelection: true, multiSelect: false, noUnselect: true, columnDefs: [ { name: '#', field: 'ID' }, { name: 'Name', field: 'CODE', sort: { direction: 'asc', priority: 1 } }, { name: 'Comment', field: 'DESCR' }, ], data: [] }; I am able to select a row and the rows are sorted by the "Name" column in ascending order as configured. As shown in the UI Grid Tutorial 210 , I have added logic to automatically select the first item

I'm trying to add a bootstrap DateRangePicker in the Filter Header Template for an Angular UI-Grid. I can see that the template is working properly because it shows the Bootstrap Icon. I do not want to use the native angular Type:'date'. I want to use a bootstrap date picker. I have a Plunker as an example further down, that shows the native datepicker working and the Bootstrap Datepicker button clickable but not displaying anyting. I have all the includes needed for this to show up. <!-- Include Required Prerequisites --> <script type="text/javascript" src="//cdn.jsdelivr.net/jquery/1/jquery

I'm trying to hide the horizontal scrollbar of a Angular ui-grid, but I can't find the right property. (Property enableScrollbars=false removes both.) Is it possible to remove only the horizontal scrollbar? nabinca With the latest version on Github v3.0.0-rc.16 you can disable horizontal and vertical Scrollbar separately. Instead of enableScrollbars = false; use enableHorizontalScrollbar = value; enableVerticalScrollbar = value; with value = 0; /* NEVER */ value = 1; /* ALWAYS */ value = 2; /* WHEN_NEEDED */ UPDATE: If you want to use constants instead of the integer-value, look at

I have an ui-grid options as follows { "enableHorizontalScrollbar":false, "enableHiding":false, "enableColumnResizing":true, "enableSorting":true, "enableColumnResize":true, "paginationPageSize":20, "enablePagination":true, "enablePaginationControls":true, "columnDefs":[ // skipped for clarity ], "data":"griddata", "excludeProperties":[ "$$hashKey" ], "enableRowHashing":true, "showHeader":true, "headerRowHeight":30, "rowHeight":30, "maxVisibleRowCount":200, "minRowsToShow":10, "showFooter":false, "footerRowHeight":30, "columnWidth":50, "maxVisibleColumnCount":200, "virtualizationThreshold":20,

I have a uigrid that contains a large number of column definitions that aren't initially filled with data because the data set would be too large. Instead, I get the requested column data when the column visibility changes. This causes an issue with the built in csv exporter. When someone chooses to "Export all data as csv" they get numerous empty columns. What I would like to do it change the default behavior of the built in csv menu items to use uiGridExporterConstants.VISIBLE. I was going to roll my own menu items like so: $scope.gridOptions.exporterMenuCsv = false; //Rolling our own menu

This is my code var app = angular.module('app', ['ui.grid']); app.controller('TableCrtl', ['$scope', '$filter', function ($scope, $filter) { var myDummyData = [{name: "Moroni",address:"one", age: 50}, {name: "Tiancum",address:"vij", age: 43}, {name: "Jacob",address:"dfr", age: 27}, {name: "Nephi",address:"mnc", age: 29}, {name: "Enos",address:"trr", age: 34}]; $scope.filterOptions = { filterText: '' }; $scope.gridOpts = { data: myDummyData, // enableFiltering: true, columnDefs: [ {name: 'Name', field: 'name', enableFiltering: true}, {name: 'Address', field: 'address', enableFiltering: true} ]