
{# PARAMS:  #}
{# id_name: should be set if one want to distinguish this table from others. #}
{% set table_id = param_id %}

<div class="row mb-2">
<div class="col-12">
    <div class="row">
        <div ><a class="btn btn-sm btn-outline-light ml-3" href="javascript:table_addRow('{{ table_id }}')"><i class="fas fa-plus-circle"></i>   </a></div>
        <div ><a class="btn btn-sm btn-outline-light ml-3" href="javascript:table_copyRows('{{ table_id }}')"><i class="fas fa-copy"></i>   </a></div>
        <div ><a class="btn btn-sm btn-outline-light ml-3" href="javascript:table_deleteRows('{{ table_id }}')"><i class="fas fa-trash-alt"></i> </a></div>
        <div ><a class="btn btn-sm btn-outline-light ml-3" href="javascript:table_rowsToClipboard('{{ table_id }}')"><i class="fas fa-clipboard-list"></i> </a></div>
        <div ><a class="btn btn-sm btn-outline-light ml-3" href="javascript:table_clipboardToRows('{{ table_id }}')"><i class="fas fa-clipboard-check"></i> </a></div>
    </div>
</div>
</div>

<div class="table-responsive">
    <table class="table" {{ id_name  }}>
        <thead class="bg-light">
            <tr class="border-0">
            {% set columns = table['columns'] %}
            {% set rows = table['value'] %}
            {% set rows_number = rows|length %}
            {%  set nrows = [rows_number, table['min_rows']]|max %}

            <th class="border-0"></th>
            {% for column in columns %}
                <th class="border-0 column-name">{{ column['label'] }}</th>
            {% endfor %}
            </tr>
        </thead>
        <tbody name="table-body" data-nextid="{{ nrows }}">

            {# Create an empty (hidden) row that will be used as template when adding new ones #}
            {% set row_id = table_id + '-ROW-TEMPLATE' %}
            <tr id="{{ row_id }}" style="display: none;">
                <td>
                    <label class="be-checkbox custom-control custom-checkbox">
                        <input type="checkbox" class="custom-control-input row-checkbox"><span class="custom-control-label"></span>
                    </label>
                </td>
            {% for column in columns %}
                {% set col_index = loop.index0 %}
                {% set col_id = column['id'] %}
                {% set param_id = '%s-col-%d'|format(row_id, col_index) %}
                {% set id_name = 'name=%s'|format(param_id) %}
                {% set data_key = ' data-key=%s '|format(col_id) %}
                {% set param = column %}
                {% set value = ''  %}
                {% set row_values = {} %}
                {% set selectpicker = False %}
                <td>
                    {% include "dynamic_param.html" %}
                </td>
            {% endfor %}
            </tr>

            {% for i in range(nrows) %}
                {% set row_index = loop.index0 %}
                {% set row_id = table_id + '-row-' + row_index|string %}
                {% set row_values = rows[row_index] if row_index < rows_number else {} %}
                {% set fake_value = ['odd', 'even'] %}

                <tr class="data-row" id="{{ row_id }}">
                    <td>
                        <label class="be-checkbox custom-control custom-checkbox">
                            <input type="checkbox" class="custom-control-input  row-checkbox" data-row="{{ row_id }}"><span class="custom-control-label"></span>
                        </label>
                    </td>
                {% for column in columns %}
                    {% set col_index = loop.index0 %}
                    {% set col_id = column['id'] %}
                    {% set param_id = 'row-%d-col-%d'|format(row_index, col_index) %}
                    {% set id_name = 'name=%s'|format(param_id) %}
                    {% set data_key = ' data-key=%s '|format(col_id) %}
                    {% set param = column %}
                    {% set value = row_values.get(col_id, '')  %}
                    {% set selectpicker = True %}
                    <td>
                        {% include "dynamic_param.html" %}
                    </td>
                {% endfor %}

                </tr>
            {% endfor %}
        </tbody>
    </table>
</div>
<!-- ============================================================== -->
<!-- end dynamic table  -->
<!-- ============================================================== -->

