javascript - 如何在服务器端过滤提供的 ui-grid 列中为过滤器创建多重选择?

标签 javascript angularjs angular-ui-grid ui-grid

我在页面上有一个 ui-grid,启用了服务器端分页和服务器端过滤,目前它只有一个下拉列表,显示来自服务器的每页 json 中所有页面的可能值。

现在我需要用户提供从下拉列表中选择多个值(如多选下拉列表)的选项,然后点击服务并收集分页数据并刷新 ui 网格。

我遇到过很多解决方案,但没有人给我服务器端解决方案,所有解决方案都与单个 json 源有关:

1. ui-grid - <http://ui-grid.info/docs/#/tutorial/306_custom_filters>
> I cannot use it as my options can be lengthier and also will be the grid look uneven and user experience will be bad

2. Using angular-dropdown-multiselect.js directive  - <http://plnkr.co/edit/MLT02DpcwoL0AK2QClow?p=preview>
> This looks fine but it is having the options hardcoded and no server interaction

3. Using custom multi select - <http://www.c-sharpcorner.com/article/how-to-create-a-custom-multi-select-filter-for-ui-grid-in-angularjs-1-x/>
> Only problem is this one is in Angular 2 or above and my application is Angular 1.4.0

请建议一些解决方案,以便我可以从服务器端响应中填充选项,并在选择时与服务器交互以获取 ui-grid 的数据集。

最佳答案

  1. Using angular-dropdown-multiselect.js directive

您可以在 multiSelectCtrl 中重写 showModal 方法,以从 API 中获取所有可用的过滤选项。

此外,在此方法中,您可以使用 $scope.col.grid - 您可以从那里获取“选择”值 (grid.columns[i].filters.selectOptions)

关于javascript - 如何在服务器端过滤提供的 ui-grid 列中为过滤器创建多重选择?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45609462/

相关文章:

html - Angular ng-style 正在添加一个样式属性,然后不保持同步

angularjs - 如何使用 Angular Material Design 创建黑白主题?

javascript - angularjs ui-grid设置selectedItems

javascript - Angular ui.grid。在两个网格之间移动行

javascript - 如何设置 facebook 像素 "submit button"跟踪

javascript - context.createConicGradient 不是函数

javascript - 如何从 ServiceWorker 流式传输视频?

javascript - 可以将 CSS 类加载到 Javascript/Jquery 变量中吗?

javascript - 在 Angular Material 中为 mdDialog Controller 设置数组类型语法

angularjs - 如何访问行选择上的行数据