Question

我正在使用扩展库Form Table控件创建表单。我最近在这篇文章中创建了一个hide-when like function函数： firing dojo onchange based on value selected in combobox

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

有关删除表单表之间空间的任何提示，或者在表单控件中执行“显示/隐藏”的其他方法吗？

感谢您的帮助。

内特

Answer 1

如果隐藏表格单元格的内容，则无效。即使隐藏了所有单元格内容，表格行仍然可见。这与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", "")

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

不幸的是，我们无法使用xe:formRow的ID，因为它在渲染过程中会丢失。这意味着，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", "")
});

Answer 2

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

作为未来的指针，如果在多个元素上具有相同的渲染属性，则dataContext将执行得更好。将dataContext放在Panel中比绑定到XPage或Custom Control本身要好。