XForms/輸出和連結
外觀
< XForms
您希望在表單的部分中顯示一組重複的 URL。每個 URL 都是透過連線一個基本 URL 和一個 URL 引數建立的。
在 XForms 應用程式中,等效於 HTML 錨標籤 (<a>) 的是 <xf:load> 元素。
如果在網頁中,您希望輸出顯示如下
<div class="links">
<a href="http://www.example.com/myservice.xq?id=1">One</a>
<a href="http://www.example.com/myservice.xq?id=2">Two</a>
<a href="http://www.example.com/myservice.xq?id=3">Three</a>
</div>
在 XForms 應用程式中,每個錨將是 xf:load。
您的輸入例項類似於以下內容
<xf:instance id="link-items" xmlns="">
<data>
<item>
<id>1<id>
<label>One</label>
</item>
<item>
<id>2<id>
<label>Two</label>
</item>
<item>
<id>3<id>
<label>Three</label>
</item>
</data>
</xf:instance>
使用 XForms,無法使用 output、value 和 concat 的組合在 repeat 內建立動態連結。這也將影響通知使用者正在離開表單的能力。
有兩種方法可以顯示連結列表。兩者都使用一個帶有關閉按鈕外觀的觸發器。第一個使用 load,在設定臨時例項後。第二個使用 submit/submission 組合。
您還可以使用 load 元素作為元素。
<xf:instance id="URL-container" xmlns="">
<URL/>
</xf:instance>
<!-- ... -->
<xf:trigger appearance="minimal">
<xf:label>One</xf:label>
<xf:action ev:event="DOMActivate">
<xf:setvalue ref="instance('URL-container')"
value="concat('http://www.example.com/my-view.xq?id=', id)"/>
<xf:load ref="instance('URL-container')"/>
</xf:action>
</xf:trigger>
<xf:instance>
以下程式在水平行中顯示連結列表。每個連結都有一個標籤和一個從例項文件中提取的 URL 字尾。
<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>Displaying Links in an XForms Application</title>
<style type="text/css">
@namespace xf url("http://www.w3.org/2002/xforms");
body {font-family:Helvetica, sans-serif}
.links xf|repeat * {display: inline;}
.url {color: blue; text-decoration:underline; margin: 0 2px;}
</style>
<xf:model>
<xf:instance xmlns="" id="links">
<data>
<link>
<label>XForms</label>
<wikipedia-id>XForms</wikipedia-id>
</link>
<link>
<label>XQuery</label>
<wikipedia-id>XQuery</wikipedia-id>
</link>
<link>
<label>XSLT</label>
<wikipedia-id>XSL Transformations</wikipedia-id>
</link>
<link>
<label>XML Database</label>
<wikipedia-id>XML_database</wikipedia-id>
</link>
<link>
<label>Declarative Programming</label>
<wikipedia-id>Declarative_programming</wikipedia-id>
</link>
<link>
<label>Functional Programming</label>
<wikipedia-id>Functional_programming</wikipedia-id>
</link>
</data>
</xf:instance>
<xf:instance id="URL-container" xmlns="">
<URL />
</xf:instance>
</xf:model>
</head>
<body>
<h3>Displaying Links in an XForms Application</h3>
<div class="links">
<xf:repeat nodeset="instance('links')/link" id="link-repeat">
<xf:trigger submission="replace-form-with" appearance="minimal" class="url">
<xf:label>
<xf:output ref="label" />
</xf:label>
<xf:hint>
<xf:output ref="wikipedia-id" />
</xf:hint>
<xf:action ev:event="DOMActivate">
<xf:setvalue ref="instance('URL-container')" value="concat('http://en.wikipedia.org/wiki/', instance('links')/link[index('link-repeat')]/wikipedia-id)" />
<xf:load ref="instance('URL-container')" />
</xf:action>
</xf:trigger>
</xf:repeat>
</div>
</body>
</html>
此解決方案由 John Clark 於 2008 年 2 月 27 日釋出到 Mozilla XForms 開發新聞組。
作為一種替代策略,您可以使用帶有 replace="all" 屬性的 submission 語句替換表單。然後,您可以使用 appearance="minimal" 樣式化提交按鈕,使按鈕看起來像連結。
<style type="text/css">
@namespace xf url("http://www.w3.org/2002/xforms");
.url {color: blue; text-decoration:underline; margin: 0 2px;}
</style>
...
<xf:submission id="replace-form-with" method="get"
ref="instance('link-items')/item[index('link-repeat')]/id"
action="http://www.example.com/my-view.xq"
replace="all" />
...
<xf:repeat nodeset="instance('link-items')/item" id="link-repeat">
<xf:submit submission="replace-form-with" appearance="minimal" class="url">
<xf:label><xf:output ref="label"/></xf:label>
</xf:submit>
此解決方案相對於使用標準連結的唯一缺點是 URL 不會顯示在狀態列中。可以透過在標籤中使用 xf:hint 元素來緩解此問題。當用戶將滑鼠懸停在連結上時,此文字將顯示。
此方法還允許您中斷提交,檢查例項資料中的更改,並在解除安裝表單之前顯示警告訊息。