TinyMCE-rails not working when used with Nested-Form

Question

I have a page where a User can add multiple products (using nested-form).

Each entry has two fields "Name" and "Description", where I am using TinyMCE-rails for description's text-area

The issue is, when I add 1st product using nested-form's link_to_add helper the tinymce editor does not allow me to type anything in it.

add_products.html.erb

<%= form.fields_for :products, @products do |product_form|-%>
  <%= render :partial => 'short_product_form', :locals => {:product_form => product_form} %>
<% end -%>
 <%= form.link_to_add "Add Product", :products %>

_short_product_form.html.erb

<%= product_form.text_area :description, :class=> "tinymce" %>
<%= tinymce :simple %>

Do I need to call anything after the product is added using link_to_add method or I have to reinitialize any settings in tinymce ?

Note : I am using tinymce-rails(3.5.8.1) gem along with asset pipeline and not plain tiny-mce

flyingjamus flyingjamus · Accepted Answer · 2013-05-29T09:02:38

You need to init TinyMCE after the new nested fields are added. So, assuming you are using tinymce-jquery, should be something like:

$(document).on('nested:fieldAdded', function(event){
  event.field.find('textarea').tinymce({
    theme: 'simple'
  });
});

Basically, you're listening for a nested:fieldAdded event, getting the dom object added (event.field) and initing tinymce on it.

TinyMCE-rails not working when used with Nested-Form

1 Answers