{% load humanize %}
<div class="row">
    <div class="table-responsive">
        <table class="table table-striped table-bordered nowrap" id="id_frmitems_table" width = "100%" datatable="datatable">
            <thead>
                <tr>
                    <!-- <th class="text-center" scope="col">#</th>-->
                    <th class="text-center" scope="col">Ingredient</th>
                    <th class="text-center" scope="col">Wt%</th>
                    <th class="text-center" scope="col">Qty. Req'd</th>
                    <th class="text-center" scope="col">Qty. Incl</th>
                    <th class="text-center" scope="col">id</th>
                </tr>
            </thead>
            <tbody>
                {% for frmitem in item_list %}
                <tr rownum="{{ forloop.counter }}">
                    <td class="text-left{% if frmitem.list.0.missing %} text-danger{% endif %}">{{ frmitem.grouper }}</td>
                    <td class="text-right">{{ frmitem.list.0.pct | floatformat:'2' | intcomma }}</td>
                    <td class="text-right">{{ frmitem.list.0.qty_req | floatformat:'0' | intcomma }}</td>
                    <td class="qty-incl text-right" id="qty-{{ frmitem.list.0.item.slug }}" data-qty="0"></td>
                    <td>{{ frmitem.list.0.item.slug }}</td>
                </tr>
              {% endfor %}
            </tbody>
        </table>
    </div>
</div>