templates/js/library/entity_collection/entity_collection.js.twig line 1

Open in your IDE?
  1. function EntityCollection(element) {
  2.     this.$element = $(element);
  3.     this.$itemsContainer = this.$element.find('.js-entity-collection-items');
  4.     this.prototypeName = this.$element.data('prototype-name') || '__name__';
  5.     this.prototypeHtml = this.$element.data('prototype') || null;
  6.     this.itemClass = this.$element.data('item-class') || 'entity-collection__item';
  7.     this.index = this.$itemsContainer.find('.' + this.itemClass).length || this.$itemsContainer.children().length;
  9.     this.init();
  10. }
  12. EntityCollection.prototype.init = function() {
  13.     var self = this;
  15.     this.$element.on('click', '.js-entity-collection-add', function() {
  16.         self.addItem();
  17.     });
  19.     // Поддерживаем разные селекторы кнопки удаления (в шаблонах мог использоваться старый класс)
  20.     this.$element.on('click', '.js-entity-collection-remove', function() {
  21.         var $item = $(this).closest('.' + self.itemClass);
  22.         if ($item.length) {
  23.             $item.remove();
  24.         }
  25.     });
  26. };
  28. EntityCollection.prototype.addItem = function() {
  29.     if (!this.prototypeHtml) {
  30.         console.warn('EntityCollection: prototypeHtml is missing');
  31.         return;
  32.     }
  34.     var newForm = this.prototypeHtml.replace(new RegExp(this.prototypeName, 'g'), this.index);
  35.     var $wrapper = $("<div></div>").addClass(this.itemClass + ' mb-3 p-3 border rounded');
  36.     $wrapper.html(newForm + "<div><button type=\"button\" class=\"btn btn-sm btn-danger mt-2 js-entity-collection-remove\">Удалить</button></div>");
  38.     this.$itemsContainer.append($wrapper);
  39.     this.index++;
  40. };