grails fields plugin <f:display is 'chopping off' bootstrap dropright action with a table答案

【问题标题】：grails fields plugin <f:display is 'chopping off' bootstrap dropright action with a table of valuesgrails fields plugin <f:display is 'chopping off' bootstrap dropright action with a table
【发布时间】：2019-02-10 18:40:58
【问题描述】：

grails v 3.3.9，字段插件

与字段 plgin 打架，在渲染域对象和使用引导程序时出现问题

我有一个简单的独立页面的示例来显示问题

<p>f:display category </p>
<f:display bean="maintenanceAgreement" >

</f:display>

<hr />

<p>f:field category</p>
<f:field bean="${this.pageScope.maintenanceAgreement}" property="category">
    <g:render template="/_fields/map/displayWidget" ></g:render>
    </f:field>

<hr />

本质上，我在“/_fields/map/displayWidget”中添加了一个模板，该模板在按钮上呈现了一个下拉右表

当您直接从您的域对象呈现地图字段时，示例表将打开，您将获得所有表

但是当你

你可以看到使用 f.display（有剪裁问题）、f.field（这似乎工作）和 f.all 之间的区别，它忽略了我的 _fields/map/_displayWidget.gsp

我不想不使用字段插件，但它不能与引导模板一起使用

有人想出解决这个问题的办法吗？

项目演示页面在这里 github standalone page to show rendering problem

附件显示了您尝试每个并选择类别属性时的输出

【问题讨论】：

还值得注意（你在上面看不到，F:display 渲染的下拉也剪辑了按钮周围的顶部阴影，左侧、底部和右侧的渲染阴影好的 - 但是顶部不存在，并且表格当然被剪裁并且无法正确呈现

标签： grails plugins bootstrap-4 field

【解决方案1】：

在平底锅下再放 2 天 - 但我有它！

起初我以为这与字段插件处理有关。所以我在本地破解了一个插件项目的克隆并添加了一些位，以便我可以观看它/调试它

在这样做时，我注意到我的虚拟 Web 域类页面我会切入插件并没有剪裁问题。但是样式不一样，所以我将普通项目中的 main.css 和 grails.css 复制回插件中，然后在浏览器中重新渲染 - 又发生了剪辑。

所以它在 css 中！。一些非常仔细的浏览器观察和浏览器“检查”表明剪辑似乎在旅程的早期就启用了。

所以在我刚刚使用的虚拟页面中

然后我花了一天时间在各种字段插件周围徘徊，因为它在任何地方都没有得到很好的解释。

如果您查看插件 taglib 显示方法，默认情况下会触发 /templates/fields/_list.gsp。命名有点奇怪，但它的 gsp 将域持久属性呈现为有序列表 - 插件默认 _list.gsp 看起来像这样

<ol class="property-list ${domainClass.decapitalizedName}">
    <g:each in="${domainProperties}" var="p">
        <li class="fieldcontain">
            <span id="${p.name}-label" class="property-label"><g:message code="${domainClass.decapitalizedName}.${p.name}.label" default="${p.defaultLabel}" /></span>
            <div class="property-value" aria-labelledby="${p.name}-label">${body(p)}</div>
        </li>
    </g:each>
</ol>

所以在通过模板进行了多次探索之后，从底部开始，我最终在顶部带有 '

现在差不多了。回到我复制的 main.css。如果你编辑它，在第 215 行左右你会得到这种风格。如果您注释掉溢出属性 - 它全部固定！

.property-list .fieldcontain {
    list-style: none;
    /*overflow: hidden; */

    zoom: 1;
}

我尝试了自动、滚动和可见，但这似乎与页面内容过多有关，因此最好将其注释掉。

一旦你这样做了——你的表单的其余部分就开始工作了！！ blimey 一行 css 来解决所有的痛苦。附件是使用的页面

最后，id 最终挖掘了 /tracing fields 插件。那是什么窝。这里没有真正完成，但基本上

没有正文的

只会呈现标签而没有内容。所以你要么需要提供一个body标签，比如让值字段显示。

作为

如果没有定义小部件模板，则调用renderDefaultDisplay，它通过'switch（prop.type）'控制渲染的选项非常有限，基本上调用g.format（bool），g。 formatDate（但不支持 LocalDateTime/LocalDate）或 g.fieldValue，其中不支持引导。

如果你打电话

这两个图并不漂亮，只是高级伪代码演示了核心标签试图做什么。有一天我会试着把它弄得漂亮些，但如果你卡住了它可能会对你有所帮助

我会直接向 grails 团队提出一个关于 main.css 剪辑的错误，看看会发生什么，但如果你犯了这个错误，你可以自己注释掉。

【讨论】：