phiamo/MopaBootstrapBundle — pull request #485 by peterrehm (2013-07-11 20:11:05+00:00)
Title: Added id and class option to collection items

In order to be able to have tabable collections there is the need for a collection-item id and the need for classes
to be added to a collection.

If you want to have tabs you can get to this with the following javascript code.

```javascript
$(document).ready(function () {
updateCollectionTabs('init');
});

$('#vendor_corebundle_formtype_collection_control_group').on('add.mopa-collection-item', function(e, row) {
updateCollectionTabs('add', row[0]);
});

$('#vendor_corebundle_formtype_collection_control_group').on('remove.mopa-collection-item', function(e, row) {
updateCollectionTabs('remove', row[0]);
});

function updateCollectionTabs(type, row)
{
$('#CollectionTabs').empty();
$('#vendor_corebundle_formtype_collection_control_group .collection-item').each(function(index, value) {
$('#CollectionTabs').append('
#' + (index + 1) + '
');
});

switch(type) {
case 'add':
$('#CollectionTabs a[href="#' + row.id + '"]').tab('show');
break;
case 'remove':
default:
$('#CollectionTabs a:first').tab('show');
break;
}
}
```

In addition to that you need to set the following options in the form builder:

```php
$builder->add(
'collection',
'collection',
array(
'widget_controls_attr' => array(
'class' => 'tab-content',
),
'widget_items_attr' => array(
'class' => 'tab-pane',
)
)
)
```

And last but not least an empty

container in the template:

``html

```

Based on the preparation you can adjust this to your needs.