angular-ui-grid

Remove sorting menu from ui-grid column header

由 最后都变了- 提交于 2019-12-03 22:10:46
I created ui-grid that has three columns, by default, the column header have a 'v' shaped icon (marked in red circle in the image) : Here the code and the plunker: var app = angular.module('app', ['ngTouch', 'ui.grid', 'ui.grid.expandable', 'ui.grid.selection', 'ui.grid.pinning']); app.controller('ThirdCtrl', ['$scope', '$http', '$log', function ($scope, $http, $log) { $scope.gridOptions = { expandableRowTemplate: 'expandableRowTemplate.html', expandableRowHeight: 150, onRegisterApi: function (gridApi) { gridApi.expandable.on.rowExpandedStateChanged($scope, function (row) { if (row.isExpanded)

Change the MenuItem icon in angular ui.gird

由 戏子无情 提交于 2019-12-03 21:39:39
How to toggle the customizing_column_menu icons in angular ui.grid like shown below I didn't found any best solution to change menuItems dynamically, Here is what I did for workaround Code $scope.gridOptions = { rowHeight: 75, columnDefs: [{ field: 'name', enableColumnMenu: false }, { field: 'gender', enableHiding: false, suppressRemoveSort: true, sort: { direction: uiGridConstants.ASC } }, { field: 'All Details', cellTemplate: '<p ng-show="grid.appScope.company"><label><b>Company:</b></label><span>{{row.entity.company}}</span></p><p ng-show="grid.appScope.email"><label><b>email:</b></label>

Format a ui-grid grid column as currency (RC 3.0)

由 跟風遠走 提交于 2019-12-03 19:21:19
问题 The grid options below display the data as expected. But If I try to to format the row.entity[col.field] value in my cellTemplate, I don't get any data returned. Code: $scope.gridOptions = { enableSorting: true, columnDefs: [ {name: 'Award Title', field: 'projectTitle', minWidth: 100 }, {name: 'Amount', field: 'awardAmount', cellTemplate: '<div>{{Number(row.entity[col.field]).toFixed(2).replace(/\d(?=(\d{3})+\.)/g, '$&,')}} ] }; Any guidance on how to format the column as currency is

Saving row data with AngularJS ui-grid $scope.saveRow

由 巧了我就是萌 提交于 2019-12-03 14:22:42
问题 I'm working on a small frontend application which will show various product shipping data in a ui-grid. I have the following code: HTML: <body ng-controller="MyCtrl"> <p ng-repeat="row in myData">{{row.name}} works at {{row.company}}</p> <button type="button" class="btn btn-success" ng-click="getCurrentFocus()">Get Current focused cell</button> <span ng-bind="currentFocused"></span> <br/> <br/> <div id="grid1" ui-grid="gridOptions" external-scopes="editRows" ui-grid-edit ui-grid-row-edit ui

Dynamically Change the Grid Options in angular ui.grid

由 别来无恙 提交于 2019-12-03 08:46:22
I have to show two types of gridOptions without using two grid's trying to change the gridOptions dynamically not working(one time working). working example http://plnkr.co/edit/4QKGIB?p=preview . $scope.grid1=function(){ $scope.gridOptions = $scope.gridOptions1; $scope.gridApi.core.notifyDataChange(uiGridConstants.dataChange.ALL); } $scope.grid2=function(){ $scope.gridOptions = $scope.gridOptions2; $scope.gridApi.core.notifyDataChange(uiGridConstants.dataChange.ALL); } Basically you need to use angular.copy() while assigning columnDef to grid, which clones the array and set it to the

How to animate Angular ui-grid when rows are added

由 允我心安 提交于 2019-12-03 07:15:19
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 rows are added immediately, which makes it jumpy. I want to the new rows to animate in so the UI Grid looks like it smoothly adds them in. Is this easily possible? Is there an option for this? It's a bit of a difficult problem because UI-Grid virtualizes the data, so there's no actual DOM elements being added and removed, or hidden and shown. That means you can't

Angular UI Grid Scroll Error

由 时光毁灭记忆、已成空白 提交于 2019-12-03 05:27:26
I am using ui grid 3.0.6. Until yesterday it was working fine. But there is a problem in Google chrome now.(Version 56.0.2924.87) When I scroll the grid, or click on scroll down arrow it starts scrolling very fast. Couldn't control the speed. It was working fine and only in Chrome. Can anyone help? Thanks in advance. Adding this style to my style.css is helped .ui-grid-viewport { overflow-anchor: none; } It's may be related to "Scroll Anchoring" feature, that has been enabled by default in Chrome 56. description of feature css-property "overflow-anchor: none", should solve this problem. 来源：

Saving row data with AngularJS ui-grid $scope.saveRow

由 流过昼夜 提交于 2019-12-03 03:31:53
I'm working on a small frontend application which will show various product shipping data in a ui-grid. I have the following code: HTML: <body ng-controller="MyCtrl"> <p ng-repeat="row in myData">{{row.name}} works at {{row.company}}</p> <button type="button" class="btn btn-success" ng-click="getCurrentFocus()">Get Current focused cell</button> <span ng-bind="currentFocused"></span> <br/> <br/> <div id="grid1" ui-grid="gridOptions" external-scopes="editRows" ui-grid-edit ui-grid-row-edit ui-grid-pinning ui-grid-paging ui-grid-cellnav class="grid"></div> </body> AngularJS: var app = angular

How to Get Filtered data from paged ui-grid

由 懵懂的女人 提交于 2019-12-03 03:28:15
I'd like to get filtered data from a ui-grid when the paging feature is enabled. In general case I used $scope.gridApi.core.on.filterChanged($scope, function () { if ($scope.gridApi.grid.columns[1].filter.term != "" && $scope.gridApi.grid.columns[1].filter.term != undefined) { var dd =$scope.gridApi.core.getVisibleRows($scope.gridApi.grid); console.log(dd); }); but the code doesn't work well when the paging is enabled, it return only rows of the first page. but I need all the filtered data. the easiest solution is filter data source based on the filter term but it decreases the performance

Action Button in Angular UI Grid 3.x version

由 |▌冷眼眸甩不掉的悲伤 提交于 2019-12-03 01:25:38
I am trying to render a simple table using Angular UI Grid (unstable version) . Against each row I need a button when clicked should be handled in my parent controller. Plunker Javascript:- angular.module("app", ['ui.grid', 'ui.grid.edit', 'ui.grid.selection', 'ui.grid.pagination', 'ui.grid.expandable', 'ui.grid.paging']).controller("appController", function($scope) { console.log("Controller is up."); $scope.data = []; for (var i = 0; i < 50; i++) { $scope.data.push({ fullName: "Name" + i, age: i }); } $scope.clickHandler = function(){ // this never gets invoked ?! console.log("Row Action
订阅 angular-ui-grid