时间戳

首页 > 解决方案 > 我想在 rails 的注册表单框中并排显示两个文本字段

ruby-on-rails - 我想在 rails 的注册表单框中并排显示两个文本字段

问题描述

我想在 rails .slim 文件中并排显示两个文本字段，

我正在使用.fields和注册框，form_for但我不知道如何在同一行显示它们：

这是我正在做的事情：

 = form_for(resource, as: resource_name, url: registration_path(resource_name),builder: Bulma::FormBuilder) do |f|
            .field
              .control
                = f.text_field :username,:style => "width:230px;", placeholder: "Enter Username", autofocus: true, autocomplete: 'username', class: 'input',label: "Username"
            br
            .field
              .control
                = f.email_field :email, :style => "width:230px;", placeholder: "Enter E-Mail", autofocus: true, autocomplete: 'email', class: 'input',label: "E-Mail"
            br
            .field
              .control
                = f.password_field :password, :style => "width:230px;", placeholder: "Enter Password", autofocus: true, autocomplete: 'password', class: 'input',label: "Password"
            br
            .field
              .control
                = f.password_field :confirm_password, :style => "width:230px;", placeholder: "Confirm Password", autofocus: true, autocomplete: 'confirm_password', class: 'input',label: "Confrirm Password"

我想要这样的东西：

Username:-----------------      E-mail:---------------------

passowrd:-----------------      confirm Password:------------------

标签： ruby-on-railsruby-on-rails-5

解决方案

将 2 个字段放在同一个框中并删除 br 标记。

 = form_for(resource, as: resource_name, url: registration_path(resource_name),builder: Bulma::FormBuilder) do |f|
  .field
    .control
      = f.text_field :username,:style => "width:230px;", placeholder: "Enter Username", autofocus: true, autocomplete: 'username', class: 'input',label: "Username"
      = f.email_field :email, :style => "width:230px;", placeholder: "Enter E-Mail", autofocus: true, autocomplete: 'email', class: 'input',label: "E-Mail"
   br
   .field
     .control
       = f.password_field :password, :style => "width:230px;", placeholder: "Enter Password", autofocus: true, autocomplete: 'password', class: 'input',label: "Password"
       = f.password_field :confirm_password, :style => "width:230px;", placeholder: "Confirm Password", autofocus: true, autocomplete: 'confirm_password', class: 'input',label: "Confrirm Password"

推荐阅读