使用haml在引导模式中创建simple_form答案

【问题标题】：Create simple_form in bootstrap modal with haml使用haml在引导模式中创建simple_form
【发布时间】：2018-07-31 13:13:56
【问题描述】：

我正在尝试在 Ruby 2.5 on Rails (v5.1) 的 Bootstrap 3 模式中使用 simple_form，并在视图中使用 haml。

我希望能够将提交按钮放在模态页脚中，但这违反了haml 约定。有什么解决方法吗？

模态

#addDataModelModal.modal.fade{"aria-hidden" => "true", "aria-labelledby" => "exampleModalLabel", role: "dialog", tabindex: "-1"}
  .modal-dialog{role: "document"}
    .modal-content
      .modal-header
        %h5#addDataModelModalLabel.modal-title Choose a Data Model
        %button.close{"aria-label" => "Close", "data-dismiss" => "modal", type: "button"}
          %span{"aria-hidden" => "true"} ×
      .modal-body
        .text-center
          = simple_form_for @project, :url => add_project_datastores_project_path, :method => 'post' do |f|
            = f.input :project_datastores, collection: @datastores, label_method: :name, value_method: :datastore_sid, prompt: "Select a Data Model"
            = f.submit 'Add Data Model', :class => 'pull-right btn btn-primary'
      .modal-footer
        %button.btn.btn-secondary{"data-dismiss" => "modal", type: "button"} Close
        .text-center

【问题讨论】：

标签： ruby-on-rails twitter-bootstrap-3 haml simple-form

【解决方案1】：

在.modal-content div 的正下方启动= simple_form_for，这样您就可以将f 变量插入到它的所有子div 中。

#addDataModelModal.modal.fade{"aria-hidden" => "true", "aria-labelledby" => "exampleModalLabel", role: "dialog", tabindex: "-1"}
  .modal-dialog{role: "document"}
    .modal-content
      = simple_form_for @project, :url => add_project_datastores_project_path, :method => 'post' do |f|
        .modal-header
          %h5#addDataModelModalLabel.modal-title Choose a Data Model
          %button.close{"aria-label" => "Close", "data-dismiss" => "modal", type: "button"}
            %span{"aria-hidden" => "true"} ×
        .modal-body
          .text-center
            = f.input :project_datastores, collection: @datastores, label_method: :name, value_method: :datastore_sid, prompt: "Select a Data Model"
        .modal-footer
          %button.btn.btn-secondary{"data-dismiss" => "modal", type: "button"} Close
          .text-center
            = f.submit 'Add Data Model', :class => 'pull-right btn btn-primary'

【讨论】：

干杯，尼克。这解决了问题。