XForms/伺服器端欄位驗證

動機

步驟

步驟 1: 新增用於傳送和接收資料的例項

<!-- store the outgoing data for the invalid e-mail check -->
<xf:instance id="email-out">
   <data xmlns="">
      <email></email>
   </data>
</xf:instance>

<!-- place to store the results of an invalid e-mail check -->
<xf:instance id="email-check-results">
   <data xmlns=""/>
</xf:instance>

步驟 2: 在模型中新增一個提交元素

提交元素將“欄位更改”事件連線到伺服器上的服務。

<xf:submission id="email-check" method="get" action="email-check.xq" 
           ref="instance('email-check')" 
           replace="instance" instance="email-check-results" />

步驟 3: 在輸入中新增一個操作

<xf:input ref="email" >
    <xf:label>Email: </xf:label>
    <xf:hint>This field must contain a valid email format.</xf:hint>
    <xf:action ev:event="xforms-value-changed">
           <!-- copy from your "save-data" into the outgoing instance -->
           <xf:setvalue ref="instance('email-out')/email" value="instance('save-data')/email"/>
           <xf:send submission="email-check"/>
    </xf:action>
</xf:input>

步驟 4: 新增一個組，如果結果無效則顯示錯誤

<xf:group ref="instance('email-check-results')/message[@class='error']">
     <div class="field-warn"><xf:output value="instance('email-check-results')/message"/></div>
</xf:group>

步驟 5: 建立一個返回 true/false 的伺服器端 REST GET 服務

If there are no errors just return <ok/>

If there are errors return
<message type="error">Invalid e-mail format</message>