Подсчет CheckBox в таблице Django -tables2 и рендеринг - PullRequest
Новая
       26

Подсчет CheckBox в таблице Django -tables2 и рендеринг

0 голосов
/ 01 апреля 2020

Я хочу отобразить фактическую сумму отмеченного поля с таблицей по django -tables2.

Структура таблицы 

class GeneralTable(tables.Table):
    """
    GeneralTable Class
    """

    id = ""

    s = tables.CheckBoxColumn(accessor="id", attrs={"th__input": {"onclick": "toggle(this)"}}, orderable=False)

    column_default_show = ['s']
    export_formats = ['csv', 'xls']


    class Meta:
        """
        Meta Class
        """
        attrs = {'class': 'table table-sm table-hover table-bordered table-striped table-condensed'}

Создание таблицы 

    table = GeneralTable(data)
    print(table.as_html(request))

Таблица html

        <table class="table table-sm table-hover table-bordered table-striped table-condensed">
                <thead >
                    <tr>
                        <th class="s">
                                <input type="checkbox" onclick="toggle(this)"/>
                        </th>
                    </tr>
                </thead>
                <tbody >
                      <tr class="even">
                            <td class="s"><input type="checkbox" name="s" value="386"/></td>
                      </tr>
                </tbody>
        </table>

HTML код

Я пытаюсь построить функцию javascript, но функция отображает счетчик установленного флажка (как исключено), но когда я считаю все флажки с флажком в столбцах заголовка, он не работает, как на рисунке ниже.

enter image description here

<p id="result"><p>
            {% block table%}
            <div
                    class="row"
                    style=" white-space: nowrap;">
                    {% load django_tables2 %}
                    {% render_table table %}
                <br/>
            </div>

            <script>
                showChecked();
                function showChecked(){
                  document.getElementById("result").textContent = "Total Number Selected = " + document.querySelectorAll("input:checked").length;
                }
                document.querySelectorAll("input[name=s]").forEach(i=>{
                 i.onclick = function(){
                  showChecked();
                 }
                });
            </script>
...