Форматирование вложенных таблиц с помощью simple_form, nested_form и twitter-bootstrap - PullRequest
Новая
       21

Форматирование вложенных таблиц с помощью simple_form, nested_form и twitter-bootstrap

6 голосов
/ 19 марта 2012

Обновление: Я обновил это после того, как покопался и понял, что это может быть twitter-bootstrap, вызывающий проблему.

Вот примерная версия моеговложенная форма: 

<%= simple_nested_form_for @user, :html => { :class => 'form-horizontal' } do |f| %>
  <fieldset>
    <%= f.input :email %>
    <%= f.input :name_first %>
    <%= f.input :name_last %>

            <table class="table table-striped">
              <thead>
                <tr>
                  <th>Active</th>
                  <th>Company</th>
                  <th>Role</th>
                  <th>Actions</th>
                </tr>
              </thead>
              <tbody>
                  <%= f.simple_fields_for :roles, :wrapper_tag => :tr do |role_form| %>
                    <td><%= role_form.hidden_field :id %><%= role_form.input :active, :label => false, :wrapper => false %></td>
                    <td><%= role_form.association :company, :label => false, :wrapper => false %></td>
                    <td><%= role_form.input :role, :label => false, :collection => [ "Guest", "User", "Inspector", "Owner"], :wrapper => false %></td>
                    <td><%= role_form.link_to_remove "Delete", :class => 'btn btn-mini btn-danger' %>
                    </td>
                  <% end %> 
              </tbody>
            </table>
               <p><%= f.link_to_add "Add a Role", :roles %></p>
        </div>

    <div class="form-actions">
      <%= f.submit nil, :class => 'btn btn-primary' %>
      <%= link_to 'Cancel', users_path, :class => 'btn' %>
    </div>
  </fieldset>
<% end %>

Когда она отображается, поля в строках таблицы имеют одинаковый отступ с родительской формой через { :class => 'form-horizontal' }.Я просто хочу, чтобы поля не содержали div-обертки и т. Д., И я не могу понять это.Я думал, что билет :wrapper => false был, но пока не повезло.

Дан

Ответы [ 4 ]

2 голосов
/ 30 марта 2012

Если вы хотите использовать таблицу (как в вашем первоначальном примере) для создания макета, я пропатчил камень nested_form здесь https://github.com/ritchiey/nested_form, чтобы разрешить это.

Чтобы указать, что выесли вы хотите, чтобы новые поля добавлялись внизу tbody и были заключены в tr, замените текущий вызов link_to_add на: 

<%= f.link_to_add "Add a Role", :roles, :container =>'tbody', :fields_element=>'tr'%>

Примечание: параметр: container является селектором CSS.

2 голосов
/ 26 марта 2012

В итоге я понял это сам. Вы должны переместить стиль формы (form-Horizontal) в div только вокруг не вложенных полей: 

<%= simple_nested_form_for @user do |f| %>
  <fieldset>
    <div class="form-horizontal">
    <%= f.input :email %>
    <%= f.input :name_first %>
    <%= f.input :name_last %>
    <%= f.input :phone %>
    <%= f.input :mobile %>

    <%= f.input :password %>
    <%= f.input :password_confirmation %>
    </div>
    <div class="tubbable">...
0 голосов
/ 03 сентября 2013

Не уверен, что это именно то, что вам нужно, но если вы хотите удалить оболочку div из поля ввода, используйте f.input_field вместо f.input: 

= f.input_field :email, label: false, placeholder: 'email'
0 голосов
/ 25 февраля 2013

Добавьте :wrapper => false к вызову simple_nested_form_for.Проблема в том, что: wrapper => false в simple_fields_for перезаписывается по умолчанию: wrapper => nil в конфигурации simple_form_for.

См. Эту ссылку для настройки: How To: Визуализация вложенных полей внутристол

...