Как я могу отформатировать эту рубиновую страницу на странице rails/haml, чтобы мои дополнительные данные отображались ниже основных данных?

Я новичок в рубине на рельсах, и в настоящее время я использую драгоценный камень кокона для создания простой вложенной формы в haml. Код ниже представляет собой представление, которое показывает данные моего раздела (раздел является родительским) с дополнительной формой вопроса, которая встраивается в страницу, если пользователь нажимает кнопку «добавить вопрос».

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

Когда я нажимаю «добавить_вопрос», на странице появляются 2 набора вопросов — НАД полями раздела. Я бы хотел, чтобы они отображались под полями раздела, но я не знаю, как это сделать. На страницу не влияет специальный CSS, это просто страница.

Страница просмотра раздела находится здесь:

%h2 Sections
= semantic_form_for @section do |f|
  = f.inputs do
    = f.input :title
    = f.input :body, :class => "textareea", :rows => 40, :cols => 6 
    = f.input :image_file_name
    = f.check_box :good_opinion, :class => "checkbox"
    = f.label "Check me if you have a good opinion of this feature", :class => "checkbox" 
    %hr
    %h3 Questions
    #questions
    = f.semantic_fields_for :section.questions do |question|
      = render 'question_fields', :f => question
      .links
    = link_to_add_association 'add question', f, :questions
  %p 
  %input{type: 'submit', value: 'Submit'}

Частичная форма question_fields находится здесь (стиль css .nested-fields в настоящее время пуст):

.nested-fields
  = f.inputs do
    = f.input :question_text
    = f.input :answer_text
    = f.input :section_id
    = link_to_remove_association "remove question", f

Любая идея относительно того, что я могу сделать, чтобы сделать это лучше?


person rockit    schedule 23.03.2014    source источник
comment
Используете ли вы Javascript для динамической загрузки полей? Если да, можете ли вы показать нам код?   -  person Richard Peck    schedule 23.03.2014
comment
Я не добавлял в приложение пользовательский javascript. Javascript (если есть) был бы добавлен драгоценным камнем кокона.   -  person rockit    schedule 23.03.2014


Ответы (1)


link_to_add_association имеет следующие параметры:

  • name: текст для отображения в ссылке f: ассоциация построителя форм: имя ассоциации (множественное число), для которой необходимо добавить новый экземпляр (символ или строка).

  • html_options: дополнительные html-опции (см. link_to Есть несколько специальных опций, первые три позволяют управлять размещением новых ссылок-данных:

    • data-association-insertion-traversal : метод обхода jquery, позволяющий выбирать узлы относительно ссылки. ближайший, следующий, дочерний и т. д. По умолчанию: абсолютный выбор

    • data-association-insertion-node : селектор jquery узла


Возможно, вам следует сделать что-то вроде этого:

link_to_add_association 'add question', f, :questions, data: {"association-insertion-method" => "after"} 
person Richard Peck    schedule 23.03.2014
comment
исследуя это, если я скопирую и вставлю то, что вы написали, я получаю сообщение об ошибке. В настоящее время читает ссылку, которую вы предоставили - person rockit; 23.03.2014
comment
Спасибо - по общему признанию, у меня нет большого опыта работы с Cocoon, поэтому я просто порекомендовал то, что, по моему мнению, потребуется. - person Richard Peck; 23.03.2014
comment
Я понял! Спасибо за совет. Ответ (для меня) заключался в том, чтобы изменить выражение, чтобы оно читалось ---› = link_to_add_association 'добавить вопрос', f, :questions, :data =› {association-insertion-method =› после} - person rockit; 23.03.2014