1

我正在 Rails 中构建一个多步骤表单。我选择走 jquery 路线并使用jquery-steps 插件。表格没有被分成两种不同的表格——表格只是放在一起在一页上。jquery-steps 插件正在页面上生成上一个和下一个按钮。我使用 fieldset 作为 bodyTag 和 h2 作为 headerTag。当我使用 chrome 开发人员工具在 div 上调用 steps() 时，向导插件似乎正在加载。尽管下面的代码在向导 div 中显示了很多 div，但即使我删除了它们，我仍然会遇到同样的问题。

<!--=== Content Part ===-->
  <div class="container content">
    <div class="row">
      <script>
                $(function ()
                {
                    $("#wizard").steps({
                        headerTag: "h2",
                        bodyTag: "fieldset",
                    });
                });
      </script>
      <div id="wizard">
        <%= form_for @suppform, url: new_business_supp_form_path do |f| %>
          <div class="col-md-6 col-md-offset-3 col-sm-8 col-sm-offset-2">
            <div class="reg-header">
              <h2>Business Contact</h2>
              <p>Enter the business's primary contact information</p>                    
            </div>
            <fieldset>
              <div class="row">
                <div class="col-sm-6">
                  <%= f.label :first_name %>
                  <%= f.text_field :first_name, :class => "form-control margin-bottom-20" %>
                </div>
                <div class="col-sm-6">
                  <%= f.label :last_name %>
                  <%= f.text_field :last_name, :class => "form-control margin-bottom-20" %>
                </div>
                    </div>
              <div class="row">
                <div class="col-sm-6">
                  <%= f.label :work_phone_number %>
                  <%= f.text_field :work_phone_number, :class => "form-control margin-bottom-20" %>
                </div>
              </div>
            </fieldset>
            <div class="reg-header">
              <h2>Business Information</h2>
              <p>Enter your business's information</p>                    
            </div>
            <fieldset>
                <%= f.label :business_address %>
                <%= f.text_field :business_address, :class => "form-control margin-bottom-20" %>
              <div class="row">
                <div class="col-sm-6">
                  <%= f.label :business_postal_code %>
                  <%= f.text_field :business_postal_code, :class => "form-control margin-bottom-20" %>
                </div>
                <div class="col-sm-6">
                  <%= f.label :business_city %>
                  <%= f.text_field :business_city, :class => "form-control margin-bottom-20" %>
                </div>
              </div>
             <hr>
            </fieldset>
          </div>
        <% end %>
      </div>
    </div>
  </div><!--/container-->       
<!--=== End Content Part ===-->
4

0 回答 0