Question

我创建了一个多步模式，每个选项卡窗格上都有一个表单输入。（使用Bootstrap选项卡）。在最后一步，我希望显示所有表单字段以供查看，以便用户可以在单击提交之前检查所有内容。

我如何抓取所有输入值并将它们附加到最后一页？最后一个标签是id＃step5。我试过用一个简单的

$('#dateReview').append($('#date').val());

然而，使用“立即”日期更新了新的div ID，一旦用户到达向导的最后一步，我需要更新它。或者也许（'改变'）但我似乎无法工作。

任何人都有一个简单的解决方案吗？

Answer 1

如果没有涉及页面刷新，那么你可以这样做：

$("#summary").html($("myForm").serialize());

（这假设一切都在表格内）。

编辑：

根据要求，以下是您可以对表单数据进行反序列化的方法：

<!DOCTYPE HTML>
<html>
  <head>
    <meta charset="utf-8">
    <title>serialize()</title>
  </head>

  <body>
    <form>
        <input type="text" name="firstName" />
        <input type="text" name="lastName" />

        <input type="checkbox" name="check1" value="yes" id="ch1">
        <label for="ch1">Yes</label>
        <input type="checkbox" name="check2" value="no" id="ch2">
        <label for="ch2">No</label>

        <input type="submit" >
    </form>    

    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
    <script>
      $("form").on("submit", function(event){
        var formData = $(this).serialize().split("&");
        console.log("You entered:");

        $.each(formData, function(index, value){
          value = value.split("=");

          // Append to div instead of logging to console
          console.log(value[0] + ": " + value[1]);
        })
        event.preventDefault();
      })
    </script>
  </body>
</html>

在提交多步骤向导之前获取所有输入值以供审阅 - 如何？

1 个答案: