Seeing some tutorials I tried to build some nested forms with option to add fields dynamically when a add button is clicked. I am completely new here and finding it difficult to solve the problem as my code does not work , neither it gives any error ! Here is the form
<%= form_for [@project, @feature], class: "form-group inline", remote: true do |builder| %>
<%= builder.fields_for :tasks, remote: true do |form| %>
<%= render "task_fields", f: form %>
<% end %>
<%= link_to_add_fields "Add Field", builder, :tasks %>
<%= builder.submit class: "btn btn-primary m-2" %>
<% end %>
And the Application helper method link_to_add_fields
is->
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
And the js code is ->
$(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()
The problem is there shows no error but does nnothing(only performs the href="#" action). How can I achieve the functionality such that I can add fields dynamically to nested form
It was actually only for those dependencies in application.js
//= require jquery
//= require jquery_ujs
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.