Признаюсь честно, я больше backend-developer, чем full-stack. Но не знать JS хотя-бы на уровне простых часто используемых задач в современном IT — нельзя. В этой статье я буду добавлять примеры часто встречающихся задач и их решение с помощью JavaScript, вернее с помощью JS-фреимворка JQuery.
$('i.dynamic.add').click(function(){ var currentRow = $(this).closest('.select-row'); var newRow = currentRow.clone(true); // true means clone and keep callbacks newRow.find('button.dynamic.remove').removeClass('hide'); newRow.insertAfter(currentRow); }); $('i.dynamic.remove').click(function(){ $(this).closest('.select-row').remove(); });
Использование:
<div class="select-row"> <input type="text" name="phone[]"> <i class="dynamic add glyphicon glyphicon-plus"></i> <i class="dynamic remove glyphicon glyphicon-minus"></i> </div>
Как это работает: при клике на элемент i с классами dynamic и add, находится блок с классом select-row (в котором находится тот элемент, на который мы кликнули), копируется и вставляется после текущего блока.
JQuery — не фреймворк, а библиотека 😉
А в целом много полезного на ресурсе по yii, за что спасибо