1

我正在使用扩展库 Form Table 控件创建一个表单。最近在这篇文章的帮助下，我能够创建一个 hide-when like 函数： 根据组合框中选择的值触发 dojo onchange

但是，我发现此代码在表单表格元素中不起作用。我可以将我的显示/隐藏 div 放在整个桌子周围，这很有效。发现这一点，我认为我可以创建多个表单并根据需要显示或隐藏它们，但这看起来很糟糕，因为表单之间存在大量空间，我不知道如何摆脱它。

关于删除表格之间的空间，或在表格控件中执行“显示/隐藏”的替代方法的任何提示？

感谢您的任何帮助。

内特

4

2 回答 2

4

如果隐藏表格单元格的内容也无济于事。即使所有单元格内容都被隐藏，表格行仍然可见。这与 Notes 客户端表不同。在浏览器中，您必须隐藏整个表格行<tr>...。</tr>

服务器端表格行显示/隐藏

您可以将隐藏代码放入<tr>标签中：

<xp:table>
    <xp:tr rendered="#{....}">

如果代码返回，则整个表格行将不可见false。

客户端表格行显示/隐藏

对于客户端显示/隐藏，您将为<tr>标签提供一个 id：

<xp:table>
    <xp:tr id="row1">

然后，您可以使用 id 寻址表行并使用例如隐藏行

dojo.style(dojo.byId("#{id:row1}"), "display", "none")

并再次显示

dojo.style(dojo.byId("#{id:row1}"), "display", "")

扩展库表单表控件的客户端表行显示/隐藏

不幸的是，我们不能使用 id ，xe:formRow因为它在渲染过程中会丢失。这意味着，该 id 不可用于客户端设置。

但是我们可以指定一个styleClass.

<xe:formTable
    id="formTable1">
    <xe:formRow
        id="formRow1"
        styleClass="classRow1">

此类名称在渲染中“存活”，我们可以使用它来获取具有此类的所有 id 并隐藏表格行

dojo.query(".classRow1").forEach(function(node, index, nodelist){
    dojo.style(node, "display", "none")
});

并再次展示

dojo.query(".classRow1").forEach(function(node, index, nodelist){
    dojo.style(node, "display", "")
});
于 2013-10-07T21:01:46.963 回答
0

“不验证或更新数据”的事件有一个属性。如果您使用它，它不会为您的部分刷新运行验证，因此会更新可见性。它仍然会运行数据转换，因此如果您在数字字段中输入非数字值，它仍然会失败。

作为未来的指针，如果您在多个元素上具有相同的渲染属性，则 dataContext 的性能会更好一些。将 dataContext 放在 Panel 中比绑定到 XPage 或自定义控件本身执行得更好。

于 2013-10-08T14:03:32.900 回答