Как просмотреть форму перед отправкой в ​​nodejs - PullRequest
2 голосов
/ 24 января 2020

Пожалуйста, ребята, у меня есть эта форма, которая состоит из трех этапов. 1. Заполните форму. 2. Просмотрите форму 3. Подтвердите форму. Я хочу, чтобы каждый раз, когда пользователь нажимал следующий на первом этапе, он отображал всю информацию, введенную пользователем на предыдущем этапе. Объясняется далее с изображениями ниже. Страница заполнения формы Страница обзора Страница отправки

Here's my HTML code
<div class="container-fluid">
  <!-- ============================================================== -->
  <!-- Start Page Content -->
  <!-- ============================================================== -->
  <div class="card">
    <div class="card-body wizard-content">
      <% if (locals.message) { %>
        <h4>
          <%= message %>
        </h4>
        <% } %>
          <h6 class="card-subtitle"></h6>
          <form id="example-form" action="/informationupdate" class="m-t-40" method="POST">
            <div>
              <h3>Account</h3>
              <section>
                <label for="date">Date *</label>
                <input id="date" name="date" type="date" class="required form-control">
                <label for="title">Title *</label>
                <input id="title" name="title" type="text" class="required form-control">
                <label for="message">Message *</label>
                <input id="message" name="message" type="text" class="required form-control">
                <p>(*) Mandatory</p>
              </section>
              <h3>Review</h3>
              <section>
                <ul>
                  <li>Date</li>
                  <li>Bar</li>
                  <li>Foobar</li>
                </ul>
              </section>
              <h3>Finish</h3>
              <section>
                <input id="acceptTerms" name="acceptTerms" type="checkbox" class="required" a href="/informationupdate">
                <label for="acceptTerms">Check the box to successfully send your information.</label>
              </section>
            </div>
          </form>
    </div>
  </div>
  <!-- ============================================================== -->
  <!-- End PAge Content -->

</div>
<!-- ============================================================== -->
<!-- End Container fluid  -->

Here's my Javascript code for form submission
<script>
        // Basic Example with form
    var form = $("#example-form");
    form.validate({
        errorPlacement: function errorPlacement(error, element) { element.before(error); },
        rules: {
            confirm: {
                equalTo: "#password"
            }
        }
    });
     form.children("div").steps({
        headerTag: "h3",
        bodyTag: "section",
        transitionEffect: "slideLeft",
        onStepChanging: function(event, currentIndex, newIndex) {
            form.validate().settings.ignore = ":disabled,:hidden";
            return form.valid();
        },
        onFinishing: function(event, currentIndex) {
            form.validate().settings.ignore = ":disabled";
            return form.valid();
        },
        onFinished: function(event, currentIndex) {
            //form.submit().settings.ignore = ":disabled";
            form.submit().alert("submitted")
            //alert("Submitted!");
        }
    });


    </script>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...