html - 带有必填字段的 Rails 下拉菜单

标签 html css ruby-on-rails ruby twitter-bootstrap

我正在尝试调整现有的配置文件设置菜单,以便我可以预先确定某些字段,例如带有下拉选项的性别,而不是用户必须输入它们。 目前的代码如下,

<%= form_for @profile, html: {multipart: true}, url: profile_path do |f| %>

  <div class="col-md-6">

    <div class="form-group">
      <%= f.text_field :firstname, required: true, placeholder: 'Firstname', class: 'form-control' %>
    </div>


    <div class="form-group">
      <%= f.text_field :lastname, required: true, placeholder: 'Lastname', class: 'form-control' %>
    </div>

      <div class="form-group">
      <%= f.date_field :dob, required: true, placeholder: 'Date of Birth', class: 'form-control' %>
    </div>

    <div class="form-group">
      <%= f.text_field :contactnr, required: true, placeholder: 'Contact Number', class: 'form-control' %>
    </div>

    <div class="form-group">
      <%= f.text_field :address1, required: true, placeholder: 'Address Line 1', class: 'form-control' %>
    </div>

    <div class="form-group">
      <%= f.text_field :address2, required: true, placeholder: 'Address Line 2', class: 'form-control' %>
    </div>

    <div class="form-group">
      <%= f.text_field :town, required: true, placeholder: 'Town', class: 'form-control' %>
    </div>

    <div class="form-group">
      <%= f.text_field :county, required: true, placeholder: 'County', class: 'form-control' %>
    </div>

    <div class="form-group">
      <%= f.text_field :country, required: true, placeholder: 'Country', class: 'form-control' %>
    </div>

    <div class="form-group">
      <%= f.text_field :postcode, required: true, placeholder: 'Postcode', class: 'form-control' %>
    </div>

    <div class="form-group">
      <%= f.text_field :gender, required: true, placeholder: 'Gender', class: 'form-control' %>
    </div>

    <form action="">
      <input type="radio" name="sex" value="Male">Male<br>
      <input type="radio" name="sex" value="Memale">Female
    </form>

  </div>

  <div class="col-md-6">

    <div class='uploaded-pic'>
      <%= image_tag @profile.image.url(:medium) %>
    </div>

    <div class="form-group">
      <%= f.file_field :image %>
    </div>

    <%= f.submit class: 'btn btn-success' %> </p>

  </div>

<%end%>

具体来说,我想混合使用以下两段代码,以便用户可以在下拉列表中选择一个值,然后在提交表单时保存该值。

<div class="form-group">
          <%= f.text_field :gender, required: true, placeholder: 'Gender', class: 'form-control' %>
        </div>

        <form action="">
          <input type="radio" name="sex" value="Male">Male<br>
          <input type="radio" name="sex" value="Memale">Female
        </form>

最佳答案

你可以像这样使用select

<%= f.select :gender, %w{Male Female}, :prompt => 'Select', required: true, placeholder: 'Gender', class: 'form-control' %>

有关更多信息,请参阅此 API .

关于html - 带有必填字段的 Rails 下拉菜单,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23514621/

相关文章:

javascript - 如何修复奇怪的 <div> 覆盖行为?

ruby-on-rails - Rails 中的良好代码示例

javascript - React Rails 组件 : manually triggering a re-render

javascript - 像 HTML5 中的多个光标一样升华

javascript - SVG 中虚线的悬停事件

html - 使用 flexbox 将 div 保持在视口(viewport)内

ruby-on-rails - 如何在 Ruby/Rails 中识别角色的语言?

html - 如何将引导导航栏实现为 lit-html/lit-element 中的组件

html - 当我在 Chrome 上增加窗口大小时, flex 元素的大小发生了变化

javascript - 创建动态范围 slider