{% load widget_tweaks %}
{% load bootstrap %}
{% load angular %}

{{ tc_formset.management_form }}
{{ tc_formset.non_form_errors }}
<fieldset id="traffic-class-formset">
    <legend id="traffic-classes">Traffic classes</legend>
    <table class="table table-bordered table-condensed">
        <thead>
        <th>Advanced</th>
        {% for field in tc_formset.forms.0.visible_fields %}
            {% if not field.widget.is_hidden %}
                <th>{{ field.label|capfirst }}</th>
            {% endif %}
        {% endfor %}
        </thead>
        {% for form in tc_forms %}
            <tr id="traffic-class-row-{{ forloop.counter0 }}">
                <td>
                    <i class="fa fa-arrows fa-lg"></i>
                    {% for hidden in form.hidden_fields %}
                        {{ hidden }}
                    {% endfor %}
                </td>
                {% for field in form.visible_fields %}
                    <td class="{% if field.errors %}has-error{% endif %}">
                        <div class="{% if not forloop.last %}form-group{% endif %}">
                            {% if not field|is_checkbox %}
                                {{ field|add_class:'form-control'|add_class:'input-sm'|add_class:'qos-input-short' | escapeangular_safe }}
                            {% else %}
                                {{ field }}
                            {% endif %}
                            {% if field.errors %}
                                <span class="help-block">
                                    {% for error in field.errors %}
                                        {{ error }}<br>
                                    {% endfor %}
                                </span>
                            {% endif %}
                        </div>
                    </td>
                {% endfor %}
            </tr>

        {% endfor %}
    </table>
</fieldset>