(function ($) { $.fn.appender = function (settings) { let appendArea = this; let rowHtml = $(settings.rowSection)[0].outerHTML; settings.hideSection ? $(settings.rowSection).remove() : ""; let rowCounter = 1; if (settings.rowNumberStart) { rowCounter = Number(settings.rowNumberStart); } $(document).on('click', settings.addBtn, function (event) { $(appendArea).append(rowHtml); if (settings.appendEffect === 'fade') { $(settings.rowSection).last().hide().fadeIn(); } else if (settings.appendEffect === 'slide') { $(settings.rowSection).last().hide().slideDown(200); } $(settings.rowSection).last().addClass(settings.addClass); $(settings.rowNumber).last().text(rowCounter); if (settings.type) { type = settings.type; } else { type = settings.rowSection; } $(type).each(function(rowIndex) { $(this).find('input[name]').each(function(){ var name; name = $(this).attr('name'); name = name.replace(/\[[0-9]?\]/g, '['+rowIndex+']'); $(this).attr('name',name); }); $(this).find('select[name]').each(function(){ var name; name = $(this).attr('name'); name = name.replace(/\[[0-9]?\]/g, '['+rowIndex+']'); $(this).attr('name',name); }); $(this).find('textarea[name]').each(function(){ var name; name = $(this).attr('name'); name = name.replace(/\[[0-9]?\]/g, '['+rowIndex+']'); $(this).attr('name',name); }); }); rowCounter++; if (settings.callback) { settings.callback(); } }); if(settings.deleteBtn) { $(document).on('click', settings.deleteBtn, function (e) { $(e.target).closest(settings.rowSection).remove(); if (settings.callback) { settings.callback(); } }) } }; }(jQuery));