angular-ui/ui-grid

UI Issue with injecting custom filters template

Open

#4,498 创建于 2015年10月9日

在 GitHub 查看
 (10 评论) (0 反应) (1 负责人)JavaScript (5,395 star) (2,496 fork)batch import
good first issue

描述

I am trying inject custom filters (Angualr ui-select controls) using filterHeaderTemplate property. Filter controls are getting rendered successfully but facing UI issues.

Filter controls are not visible properly.

image

As control is rendering in "ui-grid-header-canvas" element, because of overflow-hidden property it is happening.

But, when I added following styles

.ui-grid-header-viewport { overflow: visible; }

.ui-grid-top-panel { overflow: visible; }

.ui-grid-cell > .ui-grid-cell-contents { overflow: visible; }

grid becomes

image

Is there any way where it can be rendered properly?

贡献者指南

技术栈
javascripthtmlcss
领域
frontend
议题类型
bug
难度面向新贡献者的预计实现难度，1 表示很小改动，5 表示专家级工作。
3
预计时间有经验贡献者完成调查、实现、测试并准备 pull request 的粗略时间范围。
half day
活动状态议题当前的可参与程度：新鲜、活跃、陈旧、阻塞或等待维护者输入。
stale
清晰度议题是否清楚说明期望改动、验收标准和下一步。
mostly clear
前置要求
CSSAngularJS basics
新手友好度1-100 的估计分数，表示该议题对首次贡献者的友好程度。
30
研究方向
Investigate the ui grid header canvas element's overflow property and the CSS workaround provided in the issue. Determine if a more targeted CSS fix or a code change in the grid's template can render custom filters without breaking the layout. Check for any existing PRs or comments that propose a solution.