跳转到内容

XRX/保存文件对话框

来自维基教科书,开放的书籍,开放的世界
< XRX

您希望允许用户将表单数据保存到eXist集合中的一个命名文件中,而不会与现有文件发生冲突。

当用户选择“保存”按钮时,我们将使用 switch/case 打开保存对话框。在这个对话框中,我们将列出集合中的所有当前文件,并允许用户创建新文件,其名称不会与任何现有文件名冲突。如果用户从列表中选择一个文件,我们将用该文件名替换当前文件名。

使用 get-child-resources 函数

[编辑 | 编辑源代码]

eXist 提供一个函数来列出集合中的文件。您可以使用以下 XQuery 获取集合中所有文件的排序列表

xquery version "1.0";
declare namespace xdb="http://exist-db.org/xquery/xmldb";
declare option exist:serialize "method=xml media-type=text/xml indent=yes";

let $collection := request:get-parameter('collection', '/db/test')

return
<files>{
         for $child in xdb:get-child-resources($collection)
         order by lower-case($child)
         return
        <file>{$child}</file>
}</files>

执行此 XQuery 时,将返回集合中的文件。例如,以下是一个 XQuery 执行的 URL,其中集合参数作为参数传递

list-files-in-collection.xq?collection=/db/rss

<files>
   <file>news.rss</file>
   <file>test.rss</file>
</files>

然后,我们可以使用此 XML 列表来显示现有文件的列表,并允许用户选择不在此列表中的名称。

示例程序

[编辑 | 编辑源代码]
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:ev="http://www.w3.org/2001/xml-events" xmlns:xsd="http://www.w3.org/2001/XMLSchema" xmlns:xf="http://www.w3.org/2002/xforms">
    <head>
        <title>Save File Dialog</title>
        <link type="text/css" rel="stylesheet" href="save-panel.css" />

        <xf:model>
            
            <!-- This is the data that we want to save to a file on the server. -->
            <xf:instance id="my-data" xmlns="">
                <data>
                    <element1>Element 1</element1>
                    <element2>Element 2</element2>
                    <element3>Element 3</element3>
                    <!-- This is the file name that we are going to save the data into. -->
                    <filename>my-filename.xml</filename>
                </data>
            </xf:instance>
            
            <!-- Placeholder for the list of files in the target collection. -->
            <xf:instance xmlns="" id="list-files-results">
                <data/>
            </xf:instance>
            
            <!-- This does the save. The server-side script must look for the filename element to do the save
                to the correct file.  -->
            <xf:submission id="save" method="post" action="save.xq" ref="my-data" replace="all" />
            
            <!-- Gets the list of current files in the server-side collection and puts them in the model. -->
            <xf:submission id="list-files" method="post" action="list-files.xq" replace="instance" instance="list-files-results" />
            
         </xf:model>
    </head>
    <body>
        <h1>Example of Save File Panel</h1>
        <xf:input ref="element1">
            <xf:label>Element 1:</xf:label>
        </xf:input>
        <br/>
        <xf:input ref="element2">
            <xf:label>Element 2:</xf:label>
        </xf:input>
        <br/>
        <xf:input ref="element3">
            <xf:label>Element 3:</xf:label>
        </xf:input>
        <br/>
        <xf:switch>
            <xf:case id="default">
                <xf:submit submission="save">
                    <xf:label>Save As...</xf:label>
                    <xf:toggle case="save-dialog" ev:event="DOMActivate" />
                </xf:submit>
            </xf:case>
            <xf:case id="save-dialog">
                <xf:action ev:event="xforms-select">
                    <xf:send submission="list-files" />
                </xf:action>
                
                <!-- This turns all the files into buttons that can be selected to select a specific file. -->
                <xf:repeat nodeset="instance('list-files-results')/file" class="list-files" id="list-files-repeat">
                    <xf:trigger appearance="minimal">
                        <xf:label>
                            <xf:output ref="." />
                        </xf:label>
                        <xf:action ev:event="DOMActivate">
                            <!-- Set the filename that we will save to to the value under the selected item. -->
                            <xf:setvalue
                                ref="instance('my-data')/filename"                        
                                value="instance('list-files-results')/file[index('list-files-repeat')]" />
                        </xf:action>
                    </xf:trigger>
                </xf:repeat>
                
                
                <xf:input ref="instance('my-data')/filename">
                    <xf:label>File Name:</xf:label>
                </xf:input>
                <br/>
                <xf:submit submission="list-files">
                    <xf:label>Refresh</xf:label>
                </xf:submit>
                <xf:submit submission="save">
                    <xf:label>Save</xf:label>
                </xf:submit>
            </xf:case>
        </xf:switch> 
    </body>
</html>

CSS 文件

[编辑 | 编辑源代码]
@namespace xf url("http://www.w3.org/2002/xforms");

body {font-family: Helvetica, sans-serif;}

.list-files {
   font-size: .8em;
   color: blue;
   background-color: white;
   border: 1px solid black;
   padding: 5px;
   }

返回: 移动资源下一步: 登录和会话管理

华夏公益教科书