Question

在previous post中，我问过如何将引导类添加到数据视图中。答案是将类添加到脚本块中的“table.dataview”。在创建表之后，应用了类，一切都很顺利。

但是当我使用寻呼机时，格式化消失了。我在寻呼机上使用部分刷新只刷新数据表，但这样做意味着引导类不会应用于表。

我相信我需要添加一个事件处理程序，它将附加到dataView的刷新操作以添加该类。但是我无法让事件处理程序工作。

我的事件处理程序代码如下。

>>> [''.join(x) for comb in itertools.combinations(lists, n) for x in itertools.product(words, *comb)]

奥利弗，渲染=假只是一个错字 - 我正在测试一些东西，需要暂时压制它。

奥利弗和保罗，

昨晚我能够让部分刷新工作。

我跑过this post by Mark Roden，解释了如何做到这一点。有两种不同的方法可以实现这一目标，一种更少，一种更有效。我使用的代码如下。

<xp:eventHandler refreshMode="partial" submit="true"
            id="applyCSS" refreshId="dataView1" event="parialRefresh"
            value="what" loaded="false">
            <xp:this.binding><![CDATA[#{javascript:"pager1"}]]></xp:this.binding>
            <xp:this.action><![CDATA[#{javascript:("table.dataview").addClass("table-striped table-hover table-bordered table-condensed")}]]></xp:this.action>
        </xp:eventHandler>

然而，并不是几乎总是有一个但是在Xpages中，我在视图中有一些可排序的列，点击排序会带来同样的问题！我失去了课堂作业！

所以现在我也必须拦截那个事件，对吗？

关注这将结束的地方。不喜欢DOM操作的想法，只想拥有它。

我开始使用一个简单的视图。它工作得很好，但由于某种原因，间隔在寻呼机中搞砸了。我发现通过将寻呼机移出视图本身，我能够解决对齐问题。我认为使用视图会更好，因为我可以直接分配类，而不必进行所有这些操作。然而，知道如何为将来做这件事非常好。

这是你建议的吗？

=============================================== === 我使用输出脚本尝试了Paul Withers的建议。这适用于初始页面加载，但不适用于数据视图的任何其他更改 - 当寻呼机触发或排序或其中任何更改时。我很亲密，但还没有雪茄。有什么建议吗？

<xp:scriptBlock id="scriptBlock3">
            <xp:this.value><![CDATA[$('.dataView1PanelWrapper').on("DOMNodeInserted", function(){
    $("table.dataview").addClass("table-striped table-hover table-bordered table-condensed")
})]]></xp:this.value>
        </xp:scriptBlock>

Answer 1

将现有的xp：scriptBlock与工作代码一起移动到xe：dataView的一个方面。然后，样式将应用于初始加载和所有部分刷新。

Answer 2

你应该调用你的CSJS东西来在事件处理程序的onComplete属性中添加类 - 很难找到，只需在源代码或大纲中突出显示事件处理程序对象，然后打开＆＃34;所有属性＆＃34;找到＆＃34; onComplete＆＃34;属性。此事件允许调用CSJS。

BTW：为什么加载的属性= false？事件永远不会呈现。

Answer 3

dojo.behavior，dojo.ready和dojo.subscribe应该允许您管理它。 dojo.behavior允许您为将通过Dojo查询检索的特定元素集合定义特定行为。 dojo.ready将（我相信）在页面最初加载时运行代码，dojo.subscribe("partialrefresh-complete", null, function(method, form, refreshId) {...}将运行代码以进行部分刷新。

这是我用于将DataView的类别列图像转换为Font Awesome图标的示例代码，因此Behavior = {...}位需要修改。

Behavior = {
    // Convert xp:pagers to Bootstrap
    ".catColumn a img": {
        found: function(img_node) {
            var imgSrc = dojo.getNodeProp(img_node, "alt").toLowerCase();
            if (imgSrc.indexOf("collapse") >= 0) {
                dojo.place('<i class="fa fa-minus-square"></i>&nbsp;', img_node, 'replace');
            } else {
                dojo.place('<i class="fa fa-plus-square"></i>&nbsp;', img_node, 'replace');
            }
        }
    }
}

dojo.ready(function() {
    dojo.behavior.add(Behavior);
    dojo.behavior.apply();
});

//Make sure that future pagers are also straightened out
dojo.subscribe("partialrefresh-complete", null, function(method, form, refreshId) {
    dojo.behavior.apply();
});

Xpages将事件附加到数据视图中的寻呼机部分刷新

3 个答案: