- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我的列中的数据(由下拉列表提供)和列的过滤器应该匹配。所以我使用相同的数组来填充两者。但是,对于数据,我可以告诉 ui 网格要用于 editDropdownValueLabel 和 editDropdownIdLabel 的字段名称。过滤器属性有这样的东西吗?
我问是因为我正在设置单元格数据下拉值和从网络 api 调用检索的数组中的过滤器,并且我的单元格数据下拉列表已正确填充,但我的过滤器都显示“未定义”,这让我相信它不知道要使用 selectOptions 数组属性中的哪个字段。
当我定义我的网格时,我省略了单元格和过滤器的数组,因为我将在 web api 调用返回该数据时填充它。
{
name: 'Status',
field: 'Status',
width: 200,
editType: 'dropdown',
editableCellTemplate: 'ui-grid/dropdownEditor',
editDropdownIdLabel: 'Value',
editDropdownValueLabel: 'Value',
filter: {
type: uiGridConstants.filter.SELECT,
condition: uiGridConstants.filter.EXACT
}
}
我如何从 Web API 数据填充单元格下拉列表和过滤器下拉列表。
$scope.gridStore.columnDefs[i].editDropdownOptionsArray = response.data[colFieldName];
$scope.gridStore.columnDefs[i].filter.selectOptions = response.data[colFieldName];
最佳答案
在没有看到更多代码的情况下,很难准确地说出发生了什么,但在下面的示例中,我动态添加了 Status 列定义。
var app = angular.module('app', ['ngTouch', 'ui.grid', 'ui.grid.edit']);
app.controller('MainCtrl', ['$scope', 'uiGridConstants', function($scope, uiGridConstants) {
$scope.myData = [{
"Name": "Cox",
"Number": 41,
"Status": 1,
"Date": "10/06/1981"
}, {
"Name": "Lorraine",
"Number": 431,
"Status": 2,
"Date": "03/04/1983"
}, {
"Name": "Nancy",
"Number": 341,
"Status": 1,
"Date": "10/06/1981"
}];
// grid setup
$scope.gridStore = {
data: $scope.myData,
enableSorting: true,
enableFiltering: true,
flatEntityAccess: true,
fastWatch: true,
enableHorizontalScrollbar: 1,
enableCellSelection: true,
enableCellEditOnFocus: true,
columnDefs: [{
name: 'Number',
field: 'Number',
width: 100,
pinnedLeft: true,
enableCellEdit: false
}, {
name: 'Name',
field: 'Name',
width: 200,
pinnedLeft: true,
enableCellEdit: false
}, {
name: 'Date',
field: 'Date',
width: 100
}
]
};
this.typeLookup = function (val, arr) {
var result = arr.filter(function(v) {
return v.id === val;
})[0].type;
return result;
};
/* simulate getting JSON settings data here ... */
var jsonDef = { name: 'Status', field: 'Status', width: 150, editType: 'dropdown', editableCellTemplate: 'ui-grid/dropdownEditor', editDropdownIdLabel: 'id', editDropdownValueLabel: 'type', filter: { type: uiGridConstants.filter.SELECT, condition: uiGridConstants.filter.EXACT } };
var options = [{
id: 1,
type: 'Closed'
}, {
id: 2,
type: 'Pending'
}, {
id: 3,
type: 'Open'
}];
$scope.gridStore.columnDefs.push(jsonDef);
var idx = $scope.gridStore.columnDefs.length - 1;
$scope.gridStore.columnDefs[idx].cellTemplate = '<div class="ui-grid-cell-contents">{{ grid.appScope.Main.typeLookup(COL_FIELD,' + JSON.stringify(options) + ') }}</div>';
$scope.gridStore.columnDefs[idx].editDropdownOptionsArray = options;
$scope.gridStore.columnDefs[idx].filter.selectOptions = options.map(function(obj) {
var rObj = {'value': obj.id, 'label': obj.type};
return rObj;
});
/* end simulated JSON retrieval */
}]);
.grid {
height: 200px;
}
<!doctype html>
<html ng-app="app">
<head>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.5.0/angular.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.5.0/angular-touch.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.5.0/angular-animate.js"></script>
<script src="http://ui-grid.info/docs/grunt-scripts/csv.js"></script>
<script src="http://ui-grid.info/docs/grunt-scripts/pdfmake.js"></script>
<script src="http://ui-grid.info/docs/grunt-scripts/vfs_fonts.js"></script>
<script src="http://ui-grid.info/release/ui-grid.js"></script>
<link rel="stylesheet" href="http://ui-grid.info/release/ui-grid.css" type="text/css">
<link rel="stylesheet" href="main.css" type="text/css">
</head>
<body>
<div ng-controller="MainCtrl as Main">
<div id="grid1" ui-grid="gridStore" ui-grid-edit class="grid"></div>
</div>
</body>
</html>
关于javascript - ui网格过滤下拉,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42033611/
场景 网站页面有一个带有分页、过滤、排序功能的表格 View 。 表中的数据是从REST API服务器获取的,数据包含数百万条记录。 数据库 REST API 服务器 Web 服务器 浏览器 问
我有一个表student,其中的列dte_date(日期)具有值(2019-01-01、2019-02-01、2019-03-01)。 .等) 条件: dte_date 列中没有重复值。 但 dte_
我有一些逻辑可以根据不活动的用户创建通知。我正在获取具有以下属性的用户列表。我想做的只是在部门有非 Activity 用户时触发我的创建通知方法。因此,给出下面的列表,基本上会创建 1 个通知,表示部
使用 GPS 开发跟踪应用程序。一切都很好,但有时由于封闭区域或恶劣天气,我得到的分数不准确。当您绘制它们时,它看起来不对,有很多跃点/跳跃。 我应该运行什么算法来过滤掉不良信号对我来说,这看起来像是
我正在尝试按变量类型过滤对象数组。节点是一个具有位置的对象,但以不同的方式定义——作为点、矢量或附件。这是一个代码: class Joint { var position:Position
我想做的是在向量上创建一个过滤器,以便它删除未通过谓词测试的元素;但不太确定我该怎么做。 我根据谓词评估输入向量中的每个元素,例如在我的代码中,is_even 仿函数在 device_vector 向
我是 Gremlin 的新手,我正在使用 Gremlin 3.0.2 和 Stardog 5.0。我编写此查询是为了找出 schema.org 本体中两个实体之间的路径。以下是输出 - gremlin
考虑以下示例数据表, dt 30 的那一行需要去 - 或者如果其中两行 > 30相隔几秒钟,删除所有 3 个。然而 ,当我们有 4 行或更多行时,我们需要删除时间差 > 30 没有另一对 < 30
我正在考虑使用 ZeroMQ,并尝试了一些示例。但是,我无法验证 ZeroMQ 是否支持一些重要的要求。我希望你能帮助我。 我将使用这个简单的场景来问我的问题: 出版商(例如交易所)提供(大量)股票的
我需要从我的查询中过滤掉大量的对象。目前,它正在抓取类中的所有对象,我想将其过滤为查询字符串中的相关对象。我怎样才能做到这一点?当我尝试时,我收到一个属性错误说明 ''QuerySet' object
如何在 Prometheus 查询中添加标签过滤器? kube_pod_info kube_pod_info{created_by_kind="ReplicaSet",created_by_name=
我有包含字符串的列的数据框,并希望过滤掉包含某些字符串以外的任何内容的所有行。考虑下面的简化示例: string % dplyr::filter(stringr::str_detect(string,
我有以下数据框,其中包含多行的角度变化值: 'data.frame': 712801 obs. of 4 variables: $ time_passed: int 1 2 3 4 5 6
我有一个 BehaviorSubject我希望能够filter ,但要保持新订阅者在订阅时始终获得一个值的行为主题式质量,即使最后发出的值被过滤掉。有没有一种简洁的方法可以使用 rxjs 的内置函数来
我有一个 RSS 提要,每天输出大约 100 篇文章。我希望过滤它以仅包含更受欢迎的链接,也许将其过滤到 50 个或更少。回到当天,我相信您可以使用“postrank”来做到这一点,但在谷歌收购后现已
我有这样一个重复的xml树- this is a sample xml file yellowred blue greyredblue 如您所见,每个项目可以具有不同数量的颜色标签
我以为我在 Haskell 学习中一帆风顺,直到... 我有一个 [[Int]] tiles = [[1,0,0] ,[0,1,0] ,[0,1,0]
我在使用 Knockout.js 过滤可观察数组时遇到问题 我的js: 包含数据的数组 var docListData = [ { name: "Article Name 1", info:
我在 mongoDB 中有这个架构: var CostSchema = new Schema({ item: String, value: Number }); var Attachm
给定一个数据框“foo”,我如何才能只选择“foo”中的那些行,例如foo$location =“那里”? foo = data.frame(location = c("here", "there",
我是一名优秀的程序员,十分优秀!