{% trans_default_domain 'FOSUserBundle' %}

{#<form action="{{ path('fos_user_group_new') }}" {{ form_enctype(form) }} method="POST" class="fos_user_group_new">
    {{ form_widget(form) }}
    <div>
        <input type="submit" value="{{ 'group.new.submit'|trans }}" />
    </div>
</form>#}

<!-- form as modal panel -->
<div class="modal fade bs-example-modal-lg"
     id="new-group-modal"
     tabindex="-1"
     role="dialog"
     aria-labelledby="myModalLabel"
     aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal">
                    <span aria-hidden="true">&times;</span>
                    <span class="sr-only">Cancel</span>
                </button>
                <p class="modal-title"
                   style="font-size: 2.5vmin; font-weight: bold;">New Group</p>
            </div>
            <div class="modal-body">
                <div class="container-fluid"
                     style="padding: 0px;">
                    {% form_theme new_group_form _self %}
                    <form id="new-group-form"
                          action="{{ path('fos_user_group_new') }}" {{ form_enctype(new_group_form) }}
                          method="POST" class="fos_user_group_new">
                        <div class="container-fluid">
                            <div class="col-lg-5"><label class="form-label">Group name:</label>
                                {{ form_widget(new_group_form.name, { 'attr': {
                                'tabindex' : 1,
                                'class': 'form-control',
                                'placeholder': 'Group Name'} }) }}
                            </div>
                            <div class="col-xs-1"></div>
                            <div class="col-lg-6">
                                <div><strong>Roles</strong></div>
                                {% for choice in new_group_form.roles %}
                                    <div>{{ form_widget(choice, { 'attr': {
                                        'tabindex' : loop.index + 1 } }) }}{{ form_label(choice) }}</div>
                                {% endfor %}
                                {{ form_rest(new_group_form) }}
                            </div>

                        </div>
                    </form>
                </div>
            </div>
            <div class="modal-footer">
                <button form="new-group-form" id="new-group-modal-create-button"
                        type="submit" class="btn btn-primary">
                    {{ 'group.new.submit'|trans }}
                </button>
                <button id="new-group-modal-cancel-button"
                        type="button"
                        class="btn btn-warning"
                        data-dismiss="modal">
                    Cancel
                </button>
            </div>
        </div>
    </div>
</div>