javascript - 在 xpages 中加载引导模式

Question

在应用程序中，我有一个重复控件，对于重复中的每个条目，我都有一个相应的引导对话框模式。

当用户使用提供的 url(包括哈希值)打开 xpage 时，我想打开某个模式。哈希值对应于模态的 id，例如#view:_id1:_id152:objRepeatList:1:_id193:_id200:bootstrapModal

但是我注意到命令 $('#view:_id1:_id152:objRepeatList:1:_id193:_id200:bootstrapModal').modal('show');没有提供任何结果。

为了测试 show() 函数，我制作了一个简单的测试脚本，它获取 DOM 中的第一个模态组件并尝试打开它:

$( document ).ready(function() {    
    var cardType= '#{javascript:SSApp.getCurrentObjectCollectionCardType()}';       
    if (cardType=="cardPicture"){   
        var modals = $(".modal");
        alert(modals.length);       
        if (modals.length > 0){
            var firstModal = modals.first();
            alert("we got one");
            var firstModalId = "#" + firstModal.attr('id');
            alert( firstModal.attr('id') );             
            $(firstModalId).modal('show');
        }       
    }
});

我收到所有警报，但最后一个命令行始终给出零结果。

因为 xpage 使用部分刷新，所以我还尝试了更新页面的 eventHandler 的 onComplete 事件，但似乎需要进行大量缓存，然后四处走动，有时卡类型会以某种方式存储在内存中:

<xp:eventHandler event="onclick" submit="true"
                            refreshMode="partial" refreshId="row-body">
                            <xp:this.action>
                                <![CDATA[#{javascript:sessionScope.put("collDisplay","cards");
SSApp.currentObject.loadRelations(relation.category);}]]>
                            </xp:this.action>
                            <xp:this.onComplete><![CDATA[var cardType= '#{javascript:SSApp.getCurrentObjectCollectionCardType()}';

    if (cardType=="cardPicture"){


        var modals = $(".modal");
        alert(modals.length);

        if (modals.length > 0){
            var firstModal = modals.first();
            alert("we got one");
            var firstModalId = "#" + firstModal.attr('id');
            alert( firstModal.attr('id') );

            $(firstModalId).modal('show');
        }

    }]]></xp:this.onComplete>
                        </xp:eventHandler>

有人知道我应该做什么吗？

Answer 1

问题是 jQuery 无法找到对话框，因为 id 中存在“:”。他们必须逃脱。当您需要检索 XPages id 时，您可以使用以下一个小函数来代替 $(此函数归功于 Mark Roden)。

function x$(id){
    id = id.replace(/:/gi, "\\:");
    return ($("#" + id));
}

当您需要 XPage 项目时，请使用此函数代替 $()。

x$("view:_id1:_id152:objRepeatList:1:_id193:_id200:bootstrapModal").modal('show');