<%= ''.html_safe + " add control plugin names" %> <% (@control_plugin_names || ['']).each_with_index do |control_plugin_name, index| %> <% end %>
Control plugin name
<%= text_field_tag 'control_plugin_names[]', control_plugin_name, class: 'form-control' %> <%= ''.html_safe %>

<%= javascript_tag do %> function new_control_plugin_name() { /* Compute max index value to assign new rows with unsued index */ var max_idx = $.map($('[id^=delete_control_plugin_name_]'), function(e, i) { return e.id.split("delete_control_plugin_name_")[1] } ).sort(function(a, b) { return b - a })[0]; /* Clone existing row and reset id based on max_idx */ var row = $('#control_plugin_names_table tbody>tr:last').clone(true); var row_idx = (parseInt(max_idx) + 1).toString(); row.attr('id', "control_plugin_name_" + row_idx); row.children("td:last").children('a').attr('id', "delete_control_plugin_name_" + row_idx); /* reset value on content */ row.find('td').each(function(){ $(this).contents().each(function(){ $(this).val(''); }); }); /* Attach row into dom */ row.insertAfter('#control_plugin_names_table tbody>tr:last'); } function delete_control_plugin_name(obj) { var idx = obj.id.split("delete_control_plugin_name_")[1]; var rowCount = $('#control_plugin_names_table tr').size(); if ( rowCount > 2 ){ $("#control_plugin_name_" + idx).remove(); } else { $("#control_plugin_name_" + idx).find('td').each(function(){ $(this).contents().each(function(){ $(this).val(''); }); }); } } <% end %>