Last active
August 29, 2015 14:05
-
-
Save ostretsov/cb8fef2ad13438a5ddab to your computer and use it in GitHub Desktop.
AngularJS Collection controller for symfony2
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
sciApp.controller('AngularedCollectionController', ['$scope', '$compile', function ($scope, $compile) { | |
$scope.index = 1; | |
$scope.init = function (collectionId) { | |
var indexes = []; | |
$('#' + collectionId).find('input[type=hidden]').each(function () { | |
var attrName = $(this).attr('name'); | |
var indexFinder = new RegExp('\\]\\[(\\d+)\\]\\['); | |
var finded = indexFinder.exec(attrName); | |
if (finded.length > 1) { | |
indexes.push(parseInt(finded[1])); | |
} | |
}); | |
if (indexes.length > 0) { | |
$scope.index = Math.max.apply(Math, indexes) + 1; | |
} else { | |
$scope.index = 1; | |
} | |
}; | |
$scope.add = function (event) { | |
var $collectionItems = $(event.target).parent().find('div.collection-items'); | |
var prototype = $collectionItems.attr('data-prototype'); | |
var prototypeName = $collectionItems.attr('data-prototype-name'); | |
var prototypeLabel = $collectionItems.attr('data-prototype-label'); | |
// Just in case it doesn't get it | |
if (typeof prototypeName === 'undefined') { | |
prototypeName = '__name__'; | |
} | |
if (typeof prototypeLabel === 'undefined') { | |
prototypeLabelss = '__name__label__'; | |
} | |
var nameReplacePattern = new RegExp(prototypeName, 'g'); | |
var labelReplacePattern = new RegExp(prototypeLabel, 'g'); | |
prototype = prototype.replace(labelReplacePattern, $scope.index) | |
.replace(nameReplacePattern, $scope.index); | |
$newCollectionItem = $compile(prototype)($scope); | |
$collectionItems.append($newCollectionItem); | |
$scope.index++; | |
}; | |
}]); |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
{% block angulared_collection_widget %} | |
{% set randomCollectionId = 'collection' ~ random() ~ random() ~ random() %} | |
<div id="{{ randomCollectionId }}" ng-init="init('{{ randomCollectionId }}')" ng-controller="AngularedCollectionController"> | |
{% spaceless %} | |
{% if prototype is defined %} | |
{% set prototype_markup = form_row(prototype) %} | |
{% set data_prototype_name = form.vars.form.vars.prototype.vars.name|default('__name__') %} | |
{% set data_prototype_label = form.vars.form.vars.prototype.vars.label|default('__name__label__') %} | |
{% set widget_form_group_attr = widget_form_group_attr|merge({ | |
'data-prototype': prototype_markup, | |
'data-prototype-name': data_prototype_name, | |
'data-prototype-label': data_prototype_label | |
})|merge(attr) %} | |
{% endif %} | |
{# Add row by default use attr.class to change#} | |
{% if 'collection' in form.vars.block_prefixes and attr.class is defined %} | |
{% set widget_form_group_attr = widget_form_group_attr|merge({'class': widget_form_group_attr.class|default('row') ~ ' ' ~ attr.class}) %} | |
{% endif %} | |
{# collection item adds class {form_id}_form-group too #} | |
{% set widget_form_group_attr = widget_form_group_attr|merge({'id': 'collection' ~ id ~ '_form_group', 'class': widget_form_group_attr.class ~ ' collection-items ' ~ id ~ '_form_group'}) %} | |
<div {% for attrname,attrvalue in widget_form_group_attr %} {{attrname}}="{{attrvalue}}"{% endfor %}> | |
{# Add initial prototype form #} | |
{% if form.vars.value|length == 0 and prototype is defined %} | |
{% for name in prototype_names %} | |
{{ prototype_markup|replace({'__name__': name})|raw }} | |
{% endfor %} | |
{% endif %} | |
{{ block('form_widget') }} | |
</div> | |
{% endspaceless %} | |
<a {% for attrname,attrvalue in widget_add_btn.attr %} {{attrname}}="{{attrvalue}}"{% endfor %} ng-click="add($event)"> | |
{% if widget_add_btn.icon is not null %} | |
{{ mopa_bootstrap_icon(widget_add_btn.icon, widget_add_btn.icon_inverted|default(false)) }} | |
{% endif %} | |
{{ widget_add_btn.label|trans({}, translation_domain) }} | |
</a> | |
</div> | |
{% endblock angulared_collection_widget %} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment