xpages在弹出窗口内搜索模数

时间:2014-05-28 06:16:03

标签: xpages xpages-ssjs xpages-extlib

在你的帮助下,我确实用FTsearch创建了一个Xpage&导出到Excel功能。问题是基于多个输入字段进行搜索(比如说> 10)xpage是重发短信+考虑到还有一个视图面板,我点击搜索按钮后会列出搜索结果。

这是我尝试创建的主要原因(点击link to Search&Export后)一些弹出对话框(包含xpage,我猜)和这个弹出对话框包含我的所有输入字段+已创建的2个按钮:搜索&出口。所以,在我从弹出窗口中按下搜索按钮=>弹出对话框关闭,搜索结果显示在视图面板中,与Excel按钮相同:弹出窗口关闭,我打开excel文件。

目前,当我点击link to Search&Export我'看到'所有输入面板进行搜索(所有输入字段+两个按钮),当然还有视图面板。它确实有效,但我认为弹出对话框将更加用户友好,它将为xpage提供更多空间。

我想要做的事情:将所有输入字段+ searchexport to excel按钮移动到对话框中,该对话框应在单击链接时显示。

如何创建一个对话框,该对话框在单击链接时打开,并在下面包含此面板(其中包含FTsearch的所有输入字段和按钮)

我的面板代码包含输入字段和搜索&导出按钮:

<xp:panel style="background-color:rgb(242,242,242);border-color:rgb(168,168,168);border-width:thin;border-style:solid">
    <xp:table><xp:tr><xp:td><xp:label value="Din" id="label3" style="font-size:8pt;font-family:Verdana;color:rgb(128,0,0)">
                </xp:label></xp:td>
            <xp:td><xp:inputText id="inputText1" value="#{sessionScope.searchDate1}">
                    // some extra code
                </xp:label></xp:td>
            <xp:td></xp:td>
            <xp:td>
                <xp:inputText id="inputText2" value="#{sessionScope.searchDate2}">
                // some extra code
                </xp:inputText></xp:td>
        </xp:tr>
        <xp:tr>
            <xp:td>
                <xp:label value="Author" id="label1"
                    style="font-size:8pt;font-family:Verdana;color:rgb(128,0,0)">
                </xp:label>
                </xp:td>
            <xp:td>
                <xp:inputText id="searchAutor"
                    value="#{sessionScope.searchAutor}">
                </xp:inputText>
            </xp:td>
            <xp:td></xp:td>
            <xp:td></xp:td>
        </xp:tr>
        <xp:tr>
            <xp:td style="font-family:Verdana;font-size:8pt">
                <xp:label id="label2" value="Titlu carte"
                    style="color:rgb(128,0,0);font-size:8pt;font-family:Verdana">
                </xp:label>
            </xp:td>
            <xp:td>
                <xp:inputText id="searchTitlu"
                    value="#{sessionScope.searchTitlu}">
                </xp:inputText>
            </xp:td>
            <xp:td></xp:td>
            <xp:td></xp:td>
        </xp:tr>
        <xp:tr>
            <xp:td>
                <xp:button value="Search" id="button6"
                    styleClass="lotusFormButton">
                    <xp:eventHandler event="onclick" submit="true"
                        refreshMode="complete" immediate="false" save="true"
                        id="eventHandler1">
                    </xp:eventHandler>
                </xp:button>
            </xp:td>
            <xp:td>
                <xp:text escape="true" id="computedField1"
                    rendered="false">
                    <xp:this.value><![CDATA[#{javascript:return "Query = " + sessionScope.queryString}]]></xp:this.value>
                </xp:text>
            </xp:td>
            <xp:td></xp:td>
            <xp:td>
                <xp:button value="Export" id="button1"
                    styleClass="lotusFormButton" style="float:right;">
                    <xp:eventHandler event="onclick" submit="true"
                        refreshMode="complete" immediate="false" save="true"
                        id="eventHandler2">
                        <xp:this.action>
                            <xp:openPage
                                name="/export_hidden.xsp">
                            </xp:openPage>
                        </xp:this.action>
                    </xp:eventHandler>
                </xp:button></xp:td>
        </xp:tr>
    </xp:table></xp:panel>

感谢您的时间。

1 个答案:

答案 0 :(得分:2)

以下是一个对话框示例,您可以在其中添加字段:

<xe:dialog id="exampleDialog" title="Example dialog">
    <xp:div styleClass="lotusDialogContent">
        <!-- Add your table here -->
    </xp:div>
    <div class="lotusDialogFooter">
        <!-- 
          add your buttons here
        -->

        <!-- example cancel link -->
        <xp:link id="link1" text="Cancel" styleClass="lotusAction">
            <xp:eventHandler event="onclick" submit="false">
                <xp:this.script><![CDATA[XSP.closeDialog('#{id:exampleDialog}')]]></xp:this.script>
            </xp:eventHandler>
        </xp:link>
    </div>
</xe:dialog>

使用服务器端JS打开对话框,如下所示:

getComponent("exampleDialog").show();

或者像使用客户端JS那样:

XSP.openDialog("#{id:exampleDialog}")

您还可以使用扩展程序库完全设置内容和按钮栏区域的样式。您的对话框将如下所示:

<xe:dialog id="exampleDialog">
    <xe:dialogContent id="dialogContent1">
        <!-- content here -->
    </xe:dialogContent>
    <xe:dialogButtonBar id="dialogButtonBar1">
        <!-- buttons here -->
    </xe:dialogButtonBar>
</xe:dialog>

以下是一个按钮示例,您可以在对话框中使用该按钮关闭对话框并刷新同一XPage上的视图面板(假设视图面板名为“viewpanel1”):

<xp:button value="Search" id="searchButton">
    <xp:eventHandler event="onclick" submit="true" refreshMode="partial" immediate="false" save="false" refreshId="viewpanel1">
        <xp:this.action><![CDATA[#{javascript:
            getComponent('exampleDialog').hide()
        }]]></xp:this.action>
    </xp:eventHandler>
</xp:button>

加载页面后,您可以使用XSP.addOnLoad()打开对话框。将其添加到您的XPage:

<xp:scriptBlock id="scriptBlock1">
    <xp:this.value><![CDATA[
        XSP.addOnLoad(function(){
            XSP.openDialog("#{id:exampleDialog}")
        });
    ]]></xp:this.value>
</xp:scriptBlock>