1

我正在创建一个应用程序，我想在其中以向导格式将数据添加到表单中。我将有一系列模式对话框，逐步完成数据输入过程。我正在使用 Bootstrap 模式对话框。我打算将每个步骤保存到托管 bean。该应用程序需要在所有设备上运行，这就是我这样做的原因。

我正在尝试创建一个自定义控件来保存模式窗口，然后使用自定义属性将窗口标题、mainContent、按钮标题传递给控件。窗口标题和按钮标题工作正常。“mainContent”属性包含要在窗口中显示的自定义控件的 XML 代码。我的问题是如何让控件显示实际的自定义控件内容与自定义控件名称的 XML 字符串。我的目标是制作一个可重复使用的片段。

我曾尝试使用“包含页面”，这会使整个 xpage 消失。我曾尝试使用“dynamicContent”控件，但无法使其正常工作。我没有正确使用该控件的可能性非常明显。我把那个代码留在了那里。旁注：xpage 上的 xc:layout 是我的 Bootstrap 布局，我不认为它是其中的因素。

XPage 代码——所有这些都在调用 modalWindow 自定义控件：

<?xml version="1.0" encoding="UTF-8"?>
<xp:view xmlns:xp="http://www.ibm.com/xsp/core" xmlns:xc="http://www.ibm.com/xsp/custom">
<xc:layout>
    <xc:modalWindow button_title="Save and Continue to Step 2"
        window_title="Create New PO - Step 1 of 7">
        <xc:this.mainContent><![CDATA[<"xc:NewPO_Step1 />"]]></xc:this.body>
    </xc:modalWindow>
</xc:layout>

这是自定义控件“modalWindow”的代码

<?xml version="1.0" encoding="UTF-8"?>
<xp:view xmlns:xp="http://www.ibm.com/xsp/core" xmlns:xe="http://www.ibm.com/xsp/coreex">
<a href="#myModal" role="button" class="btn" data-toggle="modal">
    Begin Creating New PO
</a>
<div id="myModal" class="modal hide fade" tabindex="-1" role="dialog"
    aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal"
            aria-hidden="true">
            ×
        </button>
        <h3 id="myModalLabel">
            <xp:text escape="true" id="computedField3"
                value="#{javascript:compositeData.window_title}">
            </xp:text>
        </h3>
    </div>
    <div class="modal-body">
        <xe:dynamicContent id="dynamicContent1"><xp:text escape="true" id="computedField2" value="#{javascript:compositeData.mainContent}">
</xp:text><xp:this.facets>
</xp:this.facets>
        </xe:dynamicContent>
    </div>
    <div class="modal-footer">
        <button class="btn" data-dismiss="modal" aria-hidden="true">
            Cancel
        </button>
        <button class="btn btn-primary">
            <xp:text escape="true" id="computedField4"
                value="#{javascript:compositeData.button_title}">
            </xp:text>
        </button>
    </div>
</div>

4

1 回答 1

2

您可以使用“包含页面”将“.xsp”添加到自定义控件的名称：

<div class="modal-body">
    <xp:include id="include1">
        <xp:this.pageName><![CDATA[${javascript:compositeData.mainContent + ".xsp"}]]></xp:this.pageName>
    </xp:include>
</div>

添加mainContent="nameOfYourCustomControl"到 modalWindow 调用，您将获得所需的灵活性：

<?xml version="1.0" encoding="UTF-8"?>
<xp:view xmlns:xp="http://www.ibm.com/xsp/core" xmlns:xc="http://www.ibm.com/xsp/custom">
        <xc:modalWindow button_title="Save and Continue to Step 2"
            window_title="Create New PO - Step 1 of 7" mainContent="step1">
        </xc:modalWindow>
</xp:view>

在此示例中，您必须创建一个包含所有内容的自定义控件“step1”。

于 2013-05-07T19:18:59.217 回答