formtastic删除date_select中的隐藏字段(日/月)

时间:2014-07-16 13:24:55

标签: html css ruby-on-rails ruby-on-rails-4 formtastic

我在Rails 4.1中使用Formtastic

我已设置日期输入order: [:year],因为我只想捕捉年份,而不关心月份和日期。我知道您也可以使用discard_day: truediscard_month: true,但添加这些选项似乎没有任何区别。

问题在于,在我生成的HTML中,月份和日期字段是隐藏的(正如我希望的那样),但仍然占用Bootstrap列中的大量空间。我希望它们隐藏起来,也不要占用任何空间,因为它们会弄乱我的格式。

#erb
<div class="row">
  <%= f.inputs do %>
    <div class="form-group nested-fields">
      <div class="col-md-2">
        <%= f.input :date, order: [:year], start_year: Time.now.year - 100, end_year: Time.now.year %>
      </div>
      <!-- ./col-md-2 -->

      <div class="col-md-8">
        <%= f.input :description %>
      </div>
      <!-- ./col-md-8 -->

      <div class="col-md-2 fields">
        <%= link_to_remove_association "Remove previous operation", f %>
      </div>
      <!-- ./col-md-2 -->

    </div>
    <!-- ./form-group -->

  <% end %>
  <%# f.inputs %>
</div>
<!-- ./row -->

#Rendered HTML
<div class="row">
  <div id="previous_operations">

    <div class="row">
      <fieldset class="inputs">
        <div class="form-group nested-fields">
          <div class="col-md-4">
            <div class="date_select input optional form-group"id="patient_previous_operations_attributes_0_date_input"><label class="  control-label" for="patient_previous_operations_attributes_0_date">Date</label>
              <span class="form-wrapper">
                <input id="patient_previous_operations_attributes_0_date_2i" name="patient[previous_operations_attributes][0][date(2i)]" type="hidden" value="1" />
                <input id="patient_previous_operations_attributes_0_date_3i" name="patient[previous_operations_attributes][0][date(3i)]" type="hidden" value="1" />
                <div class="row">
                  <div class="col-xs-4"><select class="form-control" id="patient_previous_operations_attributes_0_date_1i" name="patient[previous_operations_attributes][0][date(1i)]" placeholder=".col-xs-4">
                      <option value=""></option>
                      ...
                      <option value="2014">2014</option>
                    </select>
                  </div>
                </div>
              </span>
            </div>
          </div>
          <!-- ./col-md-4 -->

特别注意这些行

            <input id="patient_previous_operations_attributes_0_date_2i" name="patient[previous_operations_attributes][0][date(2i)]" type="hidden" value="1" />
            <input id="patient_previous_operations_attributes_0_date_3i" name="patient[previous_operations_attributes][0][date(3i)]" type="hidden" value="1" />
            <div class="row">
              <div class="col-xs-4"><select class="form-control" id="patient_previous_operations_attributes_0_date_1i" name="patient[previous_operations_attributes][0][date(1i)]" placeholder=".col-xs-4">

前两个(date_2i和date 2i输入)是根据需要隐藏的月和日字段,但仍占据屏幕的大块。

后者(date_1i)是我想要占用当前占用的空间的两年选择(两个是不可见的)。由于某种原因,formtastic添加了&#34; col-xs-4&#34;年级控制,我认为是问题,我不知道为什么或如何关闭它。

帮助表示赞赏。

1 个答案:

答案 0 :(得分:0)

您可以使用以下内容隐藏这些字段:

discard_hour: true, discard_minute: true