ruby-on-rails - 将下拉标签、下拉和提交按钮放在同一行

Question

我正在开发一个 Rails 应用程序，我有一个下拉提交表单，如下所示，

#container
  = form_tag({:controller => "r4d", :action=> "result" }, remote: true, method: :get) do
      = label_tag(:q, "Trip Type: ")
      = select_tag(:q, options_for_select(r4d_options, "r4d_002"), class: "form-control")
      = submit_tag("Get Trip Details", :id => "submit", :class => "btn btn-sm btn-default")

这里的问题是，下拉标签出现在一行中，然后是另一行中的下拉和提交按钮。我怎样才能让它出现在同一行。我正在使用引导程序 scss。

谢谢你的帮助。

根据以下答案，我已将代码更改为

= form_tag({:controller => "r4d", :action => "result", :class => "form-inline"}, remote: true, method: :get) do
    .row
        .col-sm-12
            .col-sm-4
                = label_tag(:q, "Trip Type: ")
            .col-sm-4
                = select_tag(:q, options_for_select(r4d_options), class: "form-control")
            .col-sm-4
                = submit_tag("Get Trip Details", :id => "submit", :class => "btn btn-sm btn-default")

但是表单元素之间的间距太大，看起来不太好。

Answer 1

如果您使用的是haml，请尝试以下格式以在一行中设置内容

  .row
    .col-sm-12
      .col-sm-6
        = label_tag(:q, "Trip Type: ")
        = select_tag(:q, options_for_select(r4d_options, "r4d_002"), class: "form-control")
      .col-sm-6
        = submit_tag("Get Trip Details", :id => "submit", :class => "btn btn-sm btn-default")