У меня есть объект "досье", который отображается на многие другие объекты как CollectionType, такие как:
Эта функцияя создал, чтобы добавить или удалить элементы, которые не работают для второго объекта "Associe".
Мой исходный код для societe здесь, и я изменил некоторые переменные, чтобы адаптировать его для Associe
<div class='top7' id='societe_list' data-prototype="{{ form_widget(form.societe.vars.prototype)|e('html_attr')}}">
{% for row in form.societe %}
{% set counter = ( counter | default(0) ) + 1 %}
<div class="panel-group" id="accordion">
<div class="panel panel-default">
<div class="panel-heading">
<div class='row'>
<div class='col-md-10'>
<a data-toggle="collapse" data-parent="#accordion" href="#collapse{{ counter }}"><strong>{{ row.vars.value.nom }}</strong></a>
</div>
</div>
</div>
<div class="panel-collapse collapse in" id="collapse{{ counter }}">
<div class="col-md-6">
<!-- Text input-->
<div class="form-group">
<div class="col-md-6 control-label" for="nom">{{ form_label(row.nom)}}</div>
<div class="col-md-6">
{{form_widget(row.nom)}}
</div>
</div>
<!-- Text input-->
<div class="form-group">
<div class="col-md-6 control-label" for="formejuridique">{{ form_label(row.formejuridique)}}</div>
<div class="col-md-6">
{{form_widget(row.formejuridique)}}
</div>
</div>
<!-- Text input-->
<div class="form-group">
<div class="col-md-6 control-label" for="capital">{{ form_label(row.capital)}}</div>
<div class="col-md-6">
{{form_widget(row.capital)}}
</div>
</div>
<!-- Text input-->
<div class="form-group">
<div class="col-md-6 control-label" for="adresse">{{ form_label(row.adresse)}}</div>
<div class="col-md-6">
{{form_widget(row.adresse)}}
</div>
</div>
<!-- Text input-->
<div class="form-group">
<div class="col-md-6 control-label" for="ville">{{ form_label(row.ville)}}</div>
<div class="col-md-6">
{{form_widget(row.ville)}}
</div>
</div>
<!-- Text input-->
<div class="form-group">
<div class="col-md-6 control-label" for="codepostal">{{ form_label(row.codepostal)}}</div>
<div class="col-md-6">
{{form_widget(row.codepostal)}}
</div>
</div>
<!-- Text input-->
<div class="form-group">
<div class="col-md-6 control-label" for="noRcs">{{ form_label(row.noRcs)}}</div>
<div class="col-md-6">
{{form_widget(row.noRcs)}}
</div>
</div>
<!-- Text input-->
<div class="form-group">
<div class="col-md-6 control-label" for="villeRcs">{{ form_label(row.villeRcs)}}</div>
<div class="col-md-6">
{{form_widget(row.villeRcs)}}
</div>
</div>
</div>
</div>
</div>
</div>
{% endfor %}
<script type='text/javascript'>
var $object_list = $('#societe_list');
var $addNewItem = $('<a href="#" class="btn btn-info"> <i class="fa fa-plus-square" aria-hidden="true"></i> Ajouter une société</a>');
$(document).ready(function () {
addCollection($object_list);
});
var $collectionHolder;
function addCollection($object_list) {
// get the collectionHolder, initilize the var by getting the list;
$collectionHolder = $($object_list);
// append the add new item link to the collectionHolder
$collectionHolder.append($addNewItem);
// add an index property to the collectionHolder which helps track the count of forms we have in the list
$collectionHolder.data('index', $collectionHolder.find('.panel').length);
// finds all the panels in the list and foreach one of them we add a remove button to it
// add remove button to existing items
$collectionHolder.find('.panel').each(function () {
// $(this) means the current panel that we are at
// which means we pass the panel to the addRemoveButton function
// inside the function we create a footer and remove link and append them to the panel
// more informations in the function inside
addRemoveButton($(this));
});
// handle the click event for addNewItem
$addNewItem.click(function (e) {
// preventDefault() is your homework if you don't know what it is
// also look up preventPropagation both are usefull
e.preventDefault();
// create a new form and append it to the collectionHolder
// and by form we mean a new panel which contains the form
addNewForm();
});
}
/*
* creates a new form and appends it to the collectionHolder
*/
function addNewForm() {
// getting the prototype
// the prototype is the form itself, plain html
var prototype = $collectionHolder.data('prototype');
// get the index
// this is the index we set when the document was ready, look above for more info
var index = $collectionHolder.data('index');
// create the form
var societe_newForm = prototype;
// replace the __name__ string in the html using a regular expression with the index value
societe_newForm = societe_newForm.replace(/__name__/g, index);
// incrementing the index data and setting it again to the collectionHolder
$collectionHolder.data('index', index + 1);
// create the panel
// this is the panel that will be appending to the collectionHolder
var $societe_panel = $('<div id="societe_panel" class="panel panel-warning"><div class="panel-heading"></div></div>');
// create the panel-body and append the form to it
var $panelBody = $('<div class="panel-collapse"></div>').append(societe_newForm);
// append the body to the panel
$societe_panel.append($panelBody);
// append the removebutton to the new panel
addRemoveButton($societe_panel);
// append the panel to the addNewItem
// we are doing it this way to that the link is always at the bottom of the collectionHolder
$addNewItem.before($societe_panel);
}
function addRemoveButton($societe_panel) {
// create remove button
var $removeButton = $('<a href="#" class="btn btn-danger"> <i class="fa fa-minus-square" aria-hidden="true"></i> Supprimer</a>');
// appending the removebutton to the panel footer
var $panelFooter = $('<div class="panel-footer"></div>').append($removeButton);
// handle the click event of the remove button
$removeButton.click(function (e) {
e.preventDefault();
// gets the parent of the button that we clicked on "the panel" and animates it
// after the animation is done the element (the panel) is removed from the html
$(e.target).parents('.panel').slideUp(1000, function () {
$(this).remove();
});
});
// append the footer to the panel
$societe_panel.append($panelFooter);
}
</script>
</div>
И я изменил некоторые переменные для адаптации к Associe, как показано ниже:
var $object_list = $('#associe_list');
var $addNewItem = $('<a href="#" class="btn btn-info"> <i class="fa fa-plus-square" aria-hidden="true"></i> Ajouter une associe</a>');
var associe_newForm = prototype;
var $associe_panel = $('<div id="associe_panal" class="panel panel-warning"><div class="panel-heading"></div></div>');
Теперь работают функции добавления и удаления для Societe.Что мне еще нужно изменить, чтобы заставить его работать на Associe?