Как разместить вложенные элементы формы в Rails 3 - PullRequest
Новая
       11

Как разместить вложенные элементы формы в Rails 3

3 голосов
/ 19 февраля 2012

Я создаю приложение на Rails 3, которое использует вложенную форму с двумя уровнями вложенных атрибутов, т.е. 

<%= form_for @workareas do |f| %>
   <%= f.text_field :workarea_name %>
   <%= f.fields_for :projects  do |project| %>
      <%= f.text_field :project_name %>
      <%= f.fields_for :tasks  do |task| %>
         <%= f.text_field :task_name %>   
         <%= f.check_box :complete %>
         <%= f.check_box :urgent %>
         <%= f.check_box :today %>
      <% end %>
   <% end %>
<% end %>

(я понимаю, что этот псевдокод недопустим на 100%)

Я использую кокон для обработки вложенных форм.Я использовал Райан nested_forms, но переключился, поскольку Coccon, казалось, лучше справился с этой проблемой.

Я хотел бы отобразить задачи в таблице, что-то вроде: 

<table class="tasks">
  <tr>
    <th><%= f.label :task_name %></th>
    <th><%= f.label :complete %></th>
    <th><%= f.label :urgent %></th>
    <th><%= f.label :today %></th>
  </tr>
  <%= f.fields_for :tasks do |task| %>  
    <tr>
       <td><%= f.text_field :task_name %></td>
       <td><%= f.check_box :complete %></td>
       <td><%= f.check_box :urgent %></td>
       <td><%= f.check_box :today %></td>
    </tr>
  <% end %>
</table>
<%= link_to_add_association "New Task", f, :tasks %>

I 'Я сталкиваюсь с проблемами при вставке новых задач в правильное расположение в макете.Это потому, что будет несколько таблиц задач, по одной под каждым проектом в представлении.

Я понимаю, что могу использовать сценарий для указания позиции, в которую добавляются поля: 

$(function() {
    $("a.add_fields.").
      data("association-insertion-position", 'after').
      data("association-insertion-node", '.tasks tr:last');
});

Ноне могу понять, как передать, к какому проекту относятся задачи.Например, если у меня есть два проекта, и я пытаюсь добавить задачи во второй проект, поля в настоящее время добавляются в первый проект.(Они правильно связаны с проектом 2 при сохранении, однако, это просто проблема макета).

Кто-нибудь сталкивался с этой проблемой раньше?Есть ли лучший селектор для использования для "ассоциации-вставки-узла".Я бы приветствовал любые указания или предложения.

Спасибо !!

ОБНОВЛЕНИЕ

Мне до сих пор не удалось найти решение этой проблемы.По сути, я хочу добавить вложенные дочерние элементы, содержащиеся в блоке <tr>, в родительскую форму.Я не смог сделать эту работу так, как я хотел бы / ожидаю.

В качестве временного решения я теперь отображаю дочерние элементы в блоке <li>.Блок <li> содержит полный блок <table><tbody><tr> для каждого дочернего элемента.Это не совсем идеально с точки зрения форматирования, но лучшее, что я смог придумать.

Я собираюсь оставить этот вопрос открытым, по крайней мере, пока, в надежде, чтокто-то может предложить лучшее решение.

Спасибо всем, кто ответил до сих пор.

Ответы [ 2 ]

0 голосов
/ 01 апреля 2012

Я не нашел простой способ решить эту проблему.

В конце концов мне пришлось перезаписать javascript кокона с помощью пользовательской функции, которая по существу создает новое имя объекта ассоциации и добавляет новый объект ассоциации к существующей последовательности.

Не простое решение. Я поделюсь им с разработчиком Cocoon, и, возможно, гем можно обновить, чтобы предложить эту функциональность.

Спасибо за предложения.

0 голосов
/ 20 февраля 2012

Я не знаю, как отображаются ваши таблицы, и мой JS немного ржавый, но вы можете передать атрибут данных в link_to следующим образом: 

<%= link_to_add_association "New Task", f, :tasks, 'data-project_id' => "project_#{project.id}" %>

тогда в вашей функции: 

var project_id = $(this).data("project_id");
$("#" + project_id + " a.add_fields.").

Очень хороший учебник, где они это делают, на CodeSchool.com с jQuery Air: Captain's Log

...