angular-ui-grid

问题 I was looking at the following example of treeview using Angular 1.5: link In the css section it specifies a fixed height for .grid as follows: .grid { width: 500px; height: 500px; } Is there a way of dynamically adjusting this height according to how a tree node is clicked to expand? The relevant documentation for treeview is here. However, the example shown there also has a fixed height, which I would like to change to dynamic height. 回答1: I managed to find a solution by implementing

问题 I have one controller in angularJs(1.6) which is using ui-grid. Problem is there is one cell template. I want to get different values for rating percentage in this template. I have created a function "getRating()" and called it. But it gets called only one time. Hence I get the same value for all the template. Could anyone please help me with this? Here is my controller code: (function () { 'use strict'; define([ 'angular' ], function (angular) { function SelectToolController($scope, $timeout

问题 I want to create a dynamic UI-Grid with columns and rows dynamically generated.I have used the help from other post in Stack Overflow and able to create the grid as follows:- HTML <div ui-grid="{ data: myData.Data }" class="gridStyle" ui-grid-edit></div> Controller myApp.controller("ctrlSiteJob", ['$scope', function ($scope) { var updateDict = []; $scope.myData = { 'Type': [ 'AValues', 'BValues', 'CValues' ], 'Data': [ { 'Keys': 'Category', 'AValues': { 'ID': '1', 'Val': 'Yes' }, 'BValues': {

问题 I create an ui-grid in my controller by using an Factory-method, which creates an new Table-Object(ui-grid). But I got problems with setting up the scope in the ui-grid-event-handlers. See my js fiddle example for better understanding. In the jsfiddle you get now the error in the console: Cannot read property '$on' of undefined at Object.GridApi.registerEvent.feature.on.(anonymous function) [as navigate] If I change the handler-paramter to null, everything works fine, but... In my project,

问题 There is another stack overflow question at the following url however it happens to be a year old with zero answers: External ui-grid-menu-button Basically I need to find a way to separate ui-grid-menu-button from the top right of the table and position it somewhere else. I can't seem to find any documentation on this, i'm looking for any work arounds or a hackish solution. 回答1: This is how i solved this problem. Css to hide the original button I wrote the purpose of every line in the

问题 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", but when it is closed, in the grid I

问题 I am using ui-grid v3.0.0-rc.22 in my application. I use grouping in my grid. I have data as follow [{ "_id": "559dfaa671c2bd2c0a00002f", "title": "dfds", "sku": "fdsf", "price": "34535", "desc": "dsfsdf", "main_image": "NOPQR09345.png", "added_by": "558a526b977459300a00002b", "user": { "_id": "558a526b977459300a00002b", "name": "Merchant", } }, { "_id": "559e0a0f71c2bd2c0a000031", "title": "dfdxf", "sku": "esdf", "price": "345", "desc": "xcfgvxdvf", "main_image": "NOPQR09345.png", "added_by"

问题 I was just wondering if anyone knew of a way to sort a column in the same order as another column using Angular UI Grid. 回答1: I'm guessing you mean that if (for example) you have "First Name" and "Last Name" columns which display first name and last name respectively, you want to click sort on "Last Name" and this actually sorts the table in order of "First Name"? If so, you can accomplish this using a cell template. Assume you have the following table: and when you sort the "Last Name"

问题 I have found many questions about UI Grid autowidth issue. I managed to reproduce one of them and would like to share with you the details on how to reproduce it. First, I have the default UI Grid inside of a hidden modal (you can find the code snippet at the end of this post). Steps to reproduce: Run the code snippet, press "Launch demo modal"; (there is no issues); Close the modal; Resize browser window. here it is. Column width is reset to a wrong value. var app = angular.module('app', [

问题 I am trying to validate a value of an editable cell in ui grid and display the error. For example Required , Max-Length , Min-Length and etc. <!doctype html> <html ng-app="app"> <head> <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.3/angular.js"></script> <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.3/angular-touch.js"></script> <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.3/angular-animate.js"></script> <script src="http://ui-grid.info