Вложенные формы моделей — Railscast # 196 переработан — Добавление полей через jQuery не работает

Я следил за пересмотренным Railscast #196, и в целом все прошло нормально, но я не могу добавить новые поля во вложенную форму. Функция «удалить поля» работает хорошо, но после нажатия «link_to_add_fields» браузер переходит к началу страницы, и новое поле не появляется.

К этому railscast уже есть масса вопросов, например здесь или здесь, и я попытался прочитал их все, но большинство из них относятся к оригинальным слепкам 2010 года. Я застрял на несколько часов и не могу понять, в чем моя проблема. Извините, если это ошибка новичка, я совсем новичок в рельсах. Любая помощь могла бы быть полезна!

Я следовал исправленной версии № 196, используя Rails 3.2.13, Ruby 1.9.3.

модели/пост.рб

class Post < ActiveRecord::Base
    attr_accessible :content, :title, :image, :postfiles_attributes
    has_many :postfiles, :dependent => :destroy 
    accepts_nested_attributes_for :postfiles, allow_destroy: true
end

модели/postfile.rb

class Postfile < ActiveRecord::Base
  attr_accessible :dropbox, :gdrive, :post_id
  belongs_to :post
end

просмотры/сообщения/_form.html.erb

<%= simple_form_for @post do |f| %>

  <%= f.fields_for :postfiles do |builder| %>
       <%= render 'postfile_fields', f: builder %>
  <% end %>
  <%= link_to_add_fields "Add File", f, :postfiles %>

<% end %>

просмотры/сообщения/_postfile_fields.html.erb

<fieldset>  
    <%= f.text_field :dropbox %>
    <%= f.hidden_field :_destroy %>
    <%= link_to "remove", '#', class: "remove_fields" %>
</fieldset>

postfiles.js.coffee

jQuery ->
   $('form').on 'click', '.remove_fields', (event) ->
    $(this).prev('input[type=hidden]').val('1')
    $(this).closest('fieldset').hide()
    event.preventDefault()

  $('form').on 'click', '.add_fields', (event) ->
    time = new Date().getTime()
    regexp = new RegExp($(this).data('id'), 'g')
    $(this).before($(this).data('fields').replace(regexp, time))
    event.preventDefault()

application_helper.rb

module ApplicationHelper
  def link_to_add_fields(name, f, association)
    new_object = f.object.send(association).klass.new
    id = new_object.object_id
    fields = f.fields_for(association, new_object, child_index: id) do |builder|
      render(association.to_s.singularize + "_fields", f: builder)
    end
    link_to(name, '#', class: "add_fields", data: {id: id, fields: fields.gsub("\n", "")})
  end
end

Наперёд, большое спасибо за помощь!

ОБНОВЛЕНИЕ: я использую простую форму. См. файл _form выше. Может ли это быть проблемой?

ОБНОВЛЕНИЕ II:

Я получаю ошибку Javascript, не уверен, что это может быть проблемой для проблемы здесь: Chrome называет это «Uncaught SyntaxError: неожиданное зарезервированное слово», а Firebug называет это «SyntaxError: неограниченный строковый литерал». Ошибка указывает на эту часть кода js:

loadData: function(data){

   this.$editor.addClass('st-block__editor');

   this.$editor.html("
   <div class='st-block__inner'>
      <div class='media'>
        <a class='pull-left' >
          <img class='media-object link-pic' src='" + data.thumbnail_url + "'>
        </a>
        <div class='media-body'>
          <div class='link-source'>" + data.provider_name + "</div>
          <div class='link-title'> <a href='#'>" + data.title + "</a></div>    
          <div class='link-description'>" + data.description + "</div>  
        </div>
      </div>
    </div>
  ");
},

ОБНОВЛЕНИЕ 3:

Может ли контролер постов быть частью проблемы?

Это мой posts_controller.rb

def new
    @post = current_user.posts.new
    @post.postfiles.build

    respond_to do |format|
      format.html # new.html.erb
      format.json { render json: @post }
    end
  end

Еще раз спасибо за вашу помощь!


person YvonC    schedule 22.11.2013    source источник
comment
какие-либо ошибки javascript?   -  person sevenseacat    schedule 22.11.2013
comment
@sevenseacat Нет. Firebug ошибок не показывает.   -  person YvonC    schedule 22.11.2013
comment
даже после перехода по ссылке?   -  person sevenseacat    schedule 22.11.2013
comment
@sevenseacat Никаких ошибок после перехода по ссылке. Я получаю одну ошибку javascript, которую Chrome называет Uncaught SyntaxError: Unexpected Reserved Word, а Firebug называет ее SyntaxError: unterminated string literal. Похоже, это та же проблема, и ошибки указывают на файл sir-trevor.js. Я включу код выше. Пока не мог понять в чем проблема. Может ли это иметь какое-то отношение к проблеме здесь? В очередной раз благодарим за помощь!   -  person YvonC    schedule 22.11.2013


Ответы (2)


Случайно я обнаружил Railscast #403 в динамических формах, в котором вложенные формы также были ненадолго частью учебника. Райан использовал в этом эпизоде ​​отредактированный код для части javascript, чтобы сделать код совместимым с Turbolinks. Я попробовал версию ниже в моем postfiles.js.coffee, и это сработало! Ссылка добавления полей, наконец, создает новые поля.

$(document).on 'click', 'form .remove_fields', (event) ->
  $(this).prev('input[type=hidden]').val('1')
  $(this).closest('fieldset').hide()
  event.preventDefault()

$(document).on 'click', 'form .add_fields', (event) ->
  time = new Date().getTime()
  regexp = new RegExp($(this).data('id'), 'g')
  $(this).before($(this).data('fields').replace(regexp, time))
  event.preventDefault()
person YvonC    schedule 23.11.2013

Вы должны следить за формами единственного и множественного числа. Имя файла вашей модели должно быть postfile.rb вместо postfiles.rb.

То же самое касается _postfiles_fields.html.erb, который должен быть _postfile_fields.html.erb.

Таким образом, в основном функция не может найти шаблон, потому что он во множественном числе, а не в единственном числе, но она вызывается в форме единственного числа. Измените это, и вы должны быть в порядке. Остальной код выглядит хорошо.

person Thomas    schedule 22.11.2013
comment
Большое спасибо за ваш ответ! Вы правы, но, к сожалению, это просто ошибка редактирования, которую я допустил, когда писал вопрос. Прости! В моих файловых папках файлы имеют правильные имена файлов в единственном числе. Я исправляю имена файлов выше. Прости еще раз! - person YvonC; 22.11.2013
comment
Что ж, поскольку я не вижу никаких других проблем с кодом, я бы попытался реализовать код точно так же, как это сделал Райан, с опросами и вопросами. Если он по-прежнему не работает, сравните его с его репозиторием на github: github.com/railscasts/196-nested-model-form-revised/tree/master/ - person Thomas; 22.11.2013
comment
Я посмотрю на это, спасибо! Одна вещь: я только что понял, что использую простую форму. Может ли это быть проблемой? - person YvonC; 22.11.2013
comment
Вы должны использовать f.input вместо f.text_field, но кроме этого все должно быть в порядке. - person Thomas; 22.11.2013