Как реализовать step by step?

Question

[Egor Tini]

<div class="calc_nav">
            <!-- before_active -  -->
            <!-- active - активний -->


            <span data-step="0" class="before_active"><em>Генотип</em></span>
            <span data-step="1" class="before_active"><em>Фиброз</em></span>
            <span data-step="2" class="active"><em>Интерферон</em></span>
            <span data-step="3" class=""><em>ВИЧ</em></span>
            <span data-step="4" class="result"><em>Результат</em></span>
          </div>
          
          <form role="form">
              <div class="panel panel-primary setup-content" id="step-1">
                  <div class="panel-heading">
                       <h3 class="panel-title">Генотип</h3>
                  </div>
                  <div class="panel-body">
                      <div class="form-group form-check form-check-inline">
                        <input class="form-check-input" required="required" type="radio" name="exampleRadios" id="exampleRadios1" value="option1">
                        <label class="form-check-label" for="exampleRadios1">
                          Генотип 1
                        </label>
                      </div>
                      <div class="form-group form-check form-check-inline">
                        <input class="form-check-input" required="required" type="radio" name="exampleRadios" id="exampleRadios2" value="option2">
                        <label class="form-check-label" for="exampleRadios2">
                          Генотип 2
                        </label>
                      </div>
                      <div class="form-group form-check form-check-inline">
                        <input class="form-check-input" required="required" type="radio" name="exampleRadios" id="exampleRadios3" value="option3">
                        <label class="form-check-label" for="exampleRadios3">
                          Генотип 3
                        </label>
                      </div>
                      <button class="btn btn-primary nextBtn" type="button">Далее</button>
                  </div>
              </div>
              
              <div class="panel panel-primary setup-content" id="step-2">
                  <div class="panel-heading">
                       <h3 class="panel-title">Фиброз</h3>
                  </div>
                  <div class="panel-body">
                      <div class="form-group">
                          <label class="control-label">Name</label>
                          <input maxlength="200" type="text" required="required" class="form-control" placeholder="Enter Company Name" />
                      </div>
                      <button class="btn btn-primary nextBtn" type="button">Далее</button>
                  </div>
              </div>
              
              <div class="panel panel-primary setup-content" id="step-3">
                  <div class="panel-heading">
                       <h3 class="panel-title">Интерферон</h3>
                  </div>
                  <div class="panel-body">
                      <div class="form-group">
                          <label class="control-label">Name</label>
                          <input maxlength="200" type="text" required="required" class="form-control" placeholder="Enter Company Name" />
                      </div>
                      <button class="btn btn-primary nextBtn" type="button">Далее</button>
                  </div>
              </div>

              <div class="panel panel-primary setup-content" id="step-4">
                  <div class="panel-heading">
                       <h3 class="panel-title">ВИЧ</h3>
                  </div>
                  <div class="panel-body">
                      <div class="form-group">
                          <label class="control-label">Name</label>
                          <input maxlength="200" type="text" required="required" class="form-control" placeholder="Enter Company Name" />
                      </div>
                      <button class="btn btn-primary nextBtn" type="button">Далее</button>
                  </div>
              </div>
              
              <div class="panel panel-primary setup-content" id="step-5">
                  <div class="panel-heading">
                       <h3 class="panel-title">Результат</h3>
                  </div>
                  <div class="panel-body">
                      <div class="form-group">
                          <label class="control-label">Name</label>
                          <input maxlength="200" type="text" required="required" class="form-control" placeholder="Enter Company Name" />
                      </div>
                      <button class="btn btn-success" type="submit">Отправить</button>
                  </div>
              </div>
          </form>

Comments

[sim3x]

И заечм тут етот хтмл?

[Леонид Князев]

1. Найти плагин/библиотеку, с необходимым вам функционалом.
2. Написать необходимый вам функционал самому.
3. Нанять людей, которые напишут необходимый функционал за деньги.

[Роман]

Правильно ли я понимаю, что Вы хотите, чтобы заполнение формы происходило шаг за шагом?

[Антон]

Вопрос: Можно ли перейти к форме два не заполнив форму 1?