Question

我正在烧瓶中建造一个可折叠的行。一行下面可能有几个元素，点击时会全部折叠。如果我只是硬编码值，但是当我使用带有来自python字典的数据的循环填充表时，它工作正常，它不起作用。第一行的第一个孩子崩溃，而不是所有正确的行的孩子崩溃。下面应该是足以重现问题的代码。 elements是一个字典，其中key是一个字符串，value是一个元组列表。

<table>
<thead>
<tr>
    <th>A</th>
    <th>B</th>
    <th>C</th>
    <th>D</th>
    <th>E</th>
</tr>
</thead>
{%for k, v in elements.items()%}

<tbody>
<tbody class="labels">
<tr>
    <td colspan="5">
        <label for="i">{{k}}</label>
        <input type="checkbox" name="i" id="i" data-toggle="toggle">
    </td>
</tr>
</tbody>

{%for desc in v%}
<tbody class="hide">
<tr>

    <td>{{desc[0]}}</td>
    <td>{{desc[1]}}</td>
    <td>{{desc[2]}}</td>
    <td>
        <button>trigger</button>
    </td>
    <td>{{desc[3]}}</td>
</tr>
</tbody>
{% endfor %}

</tbody>
{% endfor %}

<script>
    $(document).ready(function() {
    $('[data-toggle="toggle"]').change(function(){
        $(this).parents().next('.hide').toggle();
    });
    });

</script>

Answer 1

<label for="i">{{k}}</label>
<input type="checkbox" name="i" id="i" data-toggle="toggle">

无意中没有更改for，name，id字段。

需要将这些更新为变量，所以看起来像

<label for={{k}}>{{k}}</label>
<input type="checkbox" name={{k}} id={{k}} data-toggle="toggle">

Python Flask可折叠/可扩展动态表

1 个答案: