傳統上,Web表格會設定為同步提交。 當使用者送出表格時,會將他們重新導向至確認頁面,或在提交失敗時,重新導向錯誤頁面。 不過,如單頁應用程式等現代化網頁體驗越來越受歡迎,而網頁會保持靜態,而主從式互動則會在背景進行。 您現在可以設定非同步提交,以提供此體驗的最適化表單。 在這種情況下,最適化表單的運作方式與單一頁面應用程式類似,因為當已提交的表單資料在伺服器上驗證時,表單不會重新載入或其URL不會變更。
閱讀相關資訊,以取得在最適化表單中非同步提交的詳細資訊。
要配置自適應表單的非同步提交,請執行以下操作:
在最適化表單製作模式中,選取「表單容器」物件並點選以開啟其屬性。
在Submission屬性區段中,啟用使用非同步提交。
在在提交部分中,選擇以下選項之一以在成功提交表單時執行。
點選以儲存屬性。
AEM Forms為表單提交提供現成可用的成功與錯誤處理常式。 處理常式是根據伺服器回應執行的用戶端函式。 當提交表單時,資料會傳送至伺服器進行驗證,而伺服器會傳回回應給用戶端,其中包含提交成功或錯誤事件的相關資訊。 這些資訊會作為參數傳遞給相關處理常式,以執行函式。
此外,表單作者和開發人員可在表單層級編寫規則,以覆寫預設處理常式。 如需詳細資訊,請參閱使用規則覆寫預設處理常式。
讓我們先檢視伺服器對成功和錯誤事件的回應。
提交成功事件的伺服器回應結構如下:
{
contentType : "<xmlschema or jsonschema>",
data : "<dataXML or dataJson>" ,
thankYouOption : <page/message>,
thankYouContent : "<thank you page url/thank you message>"
}
成功提交表單時的伺服器回應包括:
成功處理常式會讀取伺服器回應,並據以重新導向至已設定的頁面URL或顯示訊息。
伺服器對提交錯誤事件的響應結構如下:
{
errorCausedBy : "<CAPTCHA_VALIDATION or SERVER_SIDE_VALIDATION>",
errors : [
{ "somExpression" : "<SOM Expression>",
"errorMessage" : "<Error Message>"
},
...
]
}
在提交表單時發生錯誤時,伺服器回應包括:
錯誤處理程式讀取伺服器響應,並相應地在表單上顯示錯誤消息。
表單開發人員和作者可以在表單層級的程式碼編輯器中編寫規則,以覆寫預設處理常式。 成功和錯誤事件的伺服器回應會在表單層級公開,開發人員可在規則中使用$event.data
存取。
執行下列步驟,在程式碼編輯器中編寫規則,以處理成功和錯誤事件。