Django循环生成带唯一ID的HTML滑块输入框问题求助

要解决循环生成的滑块ID重复问题，有两种简单靠谱的方案：

• 用数据对象的唯一主键生成ID：如果你的cuota模型有主键（Django默认会自动生成id字段），直接把主键拼到ID里，这样每个滑块的ID和数据绑定，绝对不会重复。
• 用循环计数器生成ID：利用Django模板的forloop.counter变量，它会在每次循环时递增（从1开始），同样能保证ID唯一性。

修改后的代码示例（以主键方案为例）：

<th scope="col">Precio</th>
<th></th>
</tr>
</thead>
<tbody>
    {% for cuota in cuotas %}
    <tr> 
        <td><input name="range[]" id="range-{{ cuota.id }}" min="0" max="100" value="0" type="range"></td>
        <td><a class="price">{{ cuota.price }}</a></td>
        <td style="text-align: right">
            <button type="button" class="btn btn-secondary btn-xs text-align-right"><i class="fas fa-edit"></i></button>
            <button type="button" class="btn btn-secondary btn-xs"><i class="fas fa-trash-alt"></i></button>
        </td>
    </tr>
    {% endfor %}
</tbody>
</table>
</div>
</div>

如果用计数器方案，只需要把ID部分改成id="range-{{ forloop.counter }}"即可。另外建议把name属性改成range[]，这样后端接收请求时可以直接拿到所有滑块的数值数组，方便处理批量数据。

内容的提问来源于stack exchange，提问作者Lucho