Question

我正在使用Rails 3.2和Bootstrap 3。

我有一个表格，我希望在完成时有弹出确认。弹出窗口应列出用户在表单上的输入，并询问它们是否正确。如果单击是，则应提交表单，如果未单击，则用户应该能够再次编辑表单。

当我添加一个示例引导弹出模式代替提交按钮时，弹出窗口会在单击时显示，但会立即提交表单，并且不会让用户单击是或否。

<%= form_for(@family, :url => families_path(@family), :html => { :method => "put" }, action: "create") do |f| %>
    <%= label_tag :first_name %>
    <%= ff.text_field :first_name, placeholder: 'First Name'%>

    <%= label_tag :last_name %>
    <%= ff.text_field :last_name, placeholder: 'Last Name'%>

我是否以正确的方式进行此操作？

执行Bootstrap确认弹出窗口的最佳方法是什么？

Answer 1

默认情况下，Bootstrap按钮被赋予提交类型。我需要指定type =“button”来阻止它像提交按钮一样。

<button type="button" class="btn btn-success btn-lg btn-tall btn-circle" data-toggle="modal" data-target="#myModal">Submit</button>

然后我没有为模态中的“是”按钮指定type =按钮，因此“是”按钮将作为提交。

        <button type="button" class="btn btn-success btn-lg btn-tall btn-circle" data-toggle="modal" data-target="#myModal" style="font-size: 30px">Submit</button>

        <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
          <div class="modal-dialog">
            <div class="modal-content">
              <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                <h4 class="modal-title" id="myModalLabel"> Confirmation</h4>
              </div>
              <div class="modal-body">
                  Do you confirm?   
              </div>
              <div class="modal-footer" style="border: none">
                <button type="button" class="btn btn-default" data-dismiss="modal">No</button>
                <button class="btn btn-success">Yes</button>
              </div>
            </div>
          </div>
        </div>

Bootstrap Rails在提交表单上确认弹出窗口

1 个答案: