Блог

У меня такая проблема:

В моем веб-приложении есть форма, в которой пользователи могут настраивать свой профиль. В каждом профиле может быть указано много навыков, и я хочу разрешить пользователям нажимать одну кнопку (добавить новый навык), чтобы указать столько навыков, сколько они хотят. Итак, это код контроллера:

   accepts_nested_attributes_for :skills, :allow_destroy=>true, :reject_if => lambda {|a| a[:name].blank?}
  

Это форма (просто часть с навыком вложенного атрибута):

 <%= f.fields_for :skills do |builder|%>

    <div class="field">

        <%= builder.label :skill %>
        <%= builder.text_field :name%>
                <%= builder.hidden_field :_destroy %>

                <%= link_to 'remove', '#', :onclick=>'removeField()'%>
    </div>
                  <%end%>
  

Эта форма отлично работает и показывает все навыки пользователя, она позволяет редактировать и т.д. Проблема сейчас в том, что я хочу добавить ссылку на «добавить новый навык», поэтому функция javascript, которая изменяет форму и добавляет поле ввода нового навыка, я действительно понятия не имею, как действовать, главным образом потому, что вложенные атрибуты имеют определенный идентификатор и имя в форме, которую я не понимаю:

 <input id="profile_skills_attributes_0_name" name="profile[skills_attributes][0][name]" size="30" type="text" value="Mathematicansszz" /> 
  

Это также добавляет другое скрытое поле ввода с идентификатором навыка (невозможно предсказать, если навык не создан), делает невозможным создание нового навыка из статических страниц HTML?

  <input id="profile_skills_attributes_0_id" name="profile[skills_attributes][0][id]" type="hidden" value="3" /> 
  

Есть идея или обходной путь? Спасибо

Я написал gem, который может обрабатывать, что упрощает динамически обработку вложенных форм: cocoon. Gem работает со стандартными rails formhelpers, но также с formtastic или simple_form.

Я бы также посоветовал вам оформить заказ formtastic или simple_form, поскольку это потрясающие драгоценные камни, упрощающие обработку форм. Но, как и в случае с HAML, это личный выбор.

fields_for создает массив полей. «0» в имени представляет индекс в массиве. Поскольку вы создаете новые записи, вы можете просто игнорировать поле скрытого идентификатора.

Итак, с помощью javascript вам просто нужно сделать две вещи: 1. Подсчитать количество существующих входных данных для дочерней коллекции, чтобы получить новый индекс. 2. Добавьте новое текстовое поле, используя новый индекс.

Это относительно легко сделать с помощью jQuery, используя селектор подстановочных знаков типа $(‘input[name$=»][name]»]’).length; для получения количества (для нового индекса). Если у вас есть другое поле для массива с полями имен, вы можете вместо этого использовать селектор регулярных выражений (через плагин). Более простым способом может быть просто добавление класса к каждому из ваших входных имен навыков и использование этого класса в качестве селектора при подсчете.

Чтобы добавить новый ввод, смотрите:

http://api.jquery.com/append/

Если вы не используете jquery, то это должно быть похоже на другие фреймворки с небольшим поиском в Google.