Tôi đang trong giai đoạn đầu của việc tạo ra một ứng dụng, và đang chỉ đặt một số mã cơ bản tại chỗ. Đây là mã hiện tại ...động thêm các trường trong đường ray với các thuộc tính lồng nhau ra
app/views/thẻ/front.html.erb
<%= form_for(front_of_card_path) do |f| %>
<%= f.fields_for :competency_templates do |builder| %>
<%= render 'add_fields', f: builder %>
<% end %>
<%= link_to_add_fields "Add New Tag", f, :skill %>
<% end %>
tuyến
controller :cards do
get '/front', action: 'front', as: 'front_of_card'
post '/save', action: 'create', as: 'save_card'
get '/my_contact_info', action: 'back', as: 'back_of_card'
put '/save', action: 'update', as: 'save_card'
get '/my_card', action: 'show', as: 'card'
end
khiển
def create
@skill= Skill.new(params[:skill])
@tag = Tag.new(params[:tag])
@tag.save
@skill.tag_id = @tag.id
@skill.save
redirect_to front_of_card_path, notice: 'Skill was successfully created.'
#get user/session
#save skills & tags
end
cards.js. cà phê
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()
app_helper
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
Vì vậy, ngay bây giờ mã này mang lại cho tôi hai lĩnh vực văn bản. Một cho tên thẻ và một cho trọng lượng thẻ, và bộ điều khiển chèn tất cả mọi thứ trong DB. Tôi muốn sử dụng một số javascript để tự động thêm bao nhiêu các trường thẻ/trọng lượng theo ý muốn. Tất cả mọi thứ tôi đã tìm thấy dường như tập trung vào các thuộc tính lồng nhau. Bất kỳ ý tưởng đánh giá cao.
Cập nhật
Nhập thêm mã để xác nhận điều này. Vấn đề tôi đang gặp phải là biến số thứ ba mà tôi đang chuyển vào trên dòng này ...
<%= link_to_add_fields "Add New Tag", f, :skill %>
Nó không thích ': kỹ năng', nhưng tôi không chắc mình nên đi qua đây.
Nếu bạn chỉ sử dụng jQuery, sau đó ném những lĩnh vực thành một div với một lớp học, và khi bạn nhấp vào nút, hãy tìm phần tử đó, nd sao chép html, sau đó sử dụng 'after()' để thêm một div khác với html đã sao chép. – jeremywoertink
Chỉ muốn chỉ ra [Cocoon] tuyệt vời (https://github.com/nathanvda/cocoon) thực hiện tất cả điều này với một số tùy chọn bổ sung giúp bạn thoát khỏi loại công việc này – Romuloux