如何構建多階段Web表單？

我試圖建立一個有多個階段的webform。我正在將它從堆棧溢出/堆棧交換標記webform中構圖出來。問題是，我不知道如何觸發「下一階段」行動。如何構建多階段Web表單？

爲了說明問題，如果想在Stack Overflow上標記一個問題，請單擊flag，然後彈出提示您作出選擇。如果您選擇第二個選項（「它不屬於此處，或者它是重複的」），表單會自動將您帶到第二個屏幕。

第一屏：

page-one

一旦點擊，就自動重定向到：

page-two

的問題是，我不知道潛在的觸發是什麼。點擊該單選按鈕如何將最終用戶發送到下一個屏幕？

我試圖檢查源，但我有一種感覺，我只看到一半的畫面：

page-source

HTML教程再多我發現有類似這樣的任何做法的例子。我懷疑這是JavaScript，但我找不到可以觸發這些操作的鏈接.js文件。

因此：點擊後，webform如何自動重定向？作爲後續工作，如果使用JavaScript，是否有我可以使用的僅HTML/CSS解決方法？

來源

2012-05-11 Aarthi

就像我說的，我懷疑這是JavaScript黑魔法，在這種情況下：我需要更多的jQuery。我不知道。 – Aarthi

您可以使用jquery或多個ajax模式彈出窗口，將autopostback添加到單選按鈕，當選中或按鈕時單擊隱藏並顯示適當的模式窗體。 –

作爲一名SE員工，你難道不會去源碼並問程序員嗎？或者他們是一個繁榮的人，一羣醜陋的人？ – j08691

這可能有助於在比框架更低的層面上考慮這一點。有兩種方法可以製作多階段表格。

第一個（也是一般較老的）方法是將狀態存儲在服務器上。表單的每個階段實際上都是一個單獨的表單，客戶端通過調查問卷的進度保存在服務器上（例如，作爲會話數據的一部分）。如你猜測的那樣，第二種方法（更現代的方法）是使用JavaScript。在這種情況下實際上只有很少的黑魔法，並且根本沒有自動重定向。你所做的只是一個非常長的表單，根據用戶的選擇顯示/隱藏一些元素（當然，你可以有多個<form>元素顯示/隱藏）。

來源

2012-05-11 02:49:23

那麼，我會使用某種jQuery嚮導插件，並將其適應我的需要。我最近做了它，並沒有那麼難。你應該嘗試SmartWizard 3.0，它非常活躍，最後一個版本是在大約2個月前，編碼人員很快回答了我的問題。

這就是：https://github.com/mstratman/jQuery-Smart-Wizard

可以觸發嚮導前進到聯的事件點擊單選按鈕的動作下一步。

祝你好運:)

來源

2012-05-11 02:58:14

如何構建多階段Web表單？

回答

相關問題