Bootstrap with glyphicon打破设计

我有一种观点，我正在使用来显示选择吃午饭（Mittagessen）或/和小吃（Jause）的人。如果他们选择了其中一个选项，我想显示一个勾号（glyphicon-ok）。以前我只是显示“是” - 这是集中并在视图中看起来很好。只要我使用glyphicons的值不再居中，它们不在它们各自的列中（当两者都被选中时）并且分隔线丢失（这在屏幕截图中不是一个错误）。Bootstrap with glyphicon打破设计

enter image description here

这是我使用的视图列值的代码：我假定

 <xp:viewColumn columnName="Jause" id="viewColumn6" style="width:8%;text-align:center" displayAs="hidden"> 
      <xp:this.facets> 
       <xp:viewColumnHeader value="Jause" xp:key="header" id="viewColumnHeader6"></xp:viewColumnHeader> 
      </xp:this.facets> 
     <xp:this.styleClass><![CDATA[#{javascript:var idx = viewEntry.getColumnValues().get(6); 
     if (idx == 1) { 
      return "glyphicon glyphicon-ok" 
     }}]]></xp:this.styleClass></xp:viewColumn>

，这个问题是，我隐藏列的值。

任何想法我在做什么错误或如何正确使用Bootstrap和extlib？我看了一下ExtLib中的例子，但在ToDo.nsf应用程序中找不到。

来源

2015-06-02 Ursus Schneider

我不会用柱细胞本身的造型，但与XP插入一些HTML：text元素：

<xp:text escape="false" styleClass="glyphicon glyphicon-ok"> 
<xp:this.value><![CDATA[#{javascript:"<i class='glyphicon glyphicon-ok'/>"}]]></xp:this.value> 
<xp:this.rendered> 
return viewEntry.getColumnValues().get(6) == 1 
</xp:this.rendered> 
</xp:text>&#160;

的 在年底确保显示单元，甚至当渲染文字（HTML）不是。

来源

2015-06-02 11:50:28

正是！您必须呈现“容器”，只显示/隐藏容器内的值来维护布局:-) –

我尝试在xp：viewColumHeader之后的xp：viewColumn中添加代码，但它不适用于我...我找不到在评论中添加代码的方式？ –

对不起...我正在考虑重复控制而不是视图。我强烈建议您使用重复控制，除非您需要类别。 –

Bootstrap with glyphicon打破设计

回答

相关问题