Python 所有删除按钮都附加到第一行

我有下面的代码，它以行的形式显示一些数据，每个按钮都有“Delete”按钮

在我的例子中，“删除”按钮总是删除列表中的第一行，即使我试图从列表中删除最后一行或从列表中删除最后一行，第一行就会被删除。

不确定为什么所有按钮在FOR循环中时都与第一行关联

更新#1：我做了一些测试，我可以看到每个按钮都知道自己行的正确数据，但在我单击按钮后，它会点击数据目标=“#deleteLocation”，而这个新的部分“#deleteLocation”总是只知道第一行

routes.py

@org_settings.route("/locations", methods=["GET"])
def locations():
    form = LocationForm()
    page = request.args.get("page", 1, type=int)
    locations = (
        Location.query.filter_by(user_id=current_user.id)
        .order_by(Location.name.asc())
        .paginate(page=page, per_page=5)
    )
    return render_template(
        "settings/locations.html",
        title="Locations",
        locations_tab="active",
        locations=locations,
        form=form,
    )

@org_settings.route("/locations/<int:location_id>/delete", methods=["GET", "POST"])
@login_required
def delete_location(location_id):
    location = Location.query.get_or_404(location_id)
    if location.organization != current_user:
        abort(403)
    db.session.delete(location)
    db.session.commit()
    flash("Your location has been deleted!", "info")
    return redirect(url_for("org_settings.locations"))

---

我通过将{location.ID}行的ID添加到html部分的ID中来解决这个问题 数据目标=“#deleteLocation-{{location.id}” 如下

```

您是否尝试在

删除位置

函数中记录

位置id

以查看是否获得了预期值？我认为问题在于html代码，因为按钮知道正确的值，但一旦我按下按钮，它就会点击数据目标=“#deleteLocation”和“#deleteLocation”下的数据它只知道第一行的值

<table class="table">
    <thead class="thead-dark">
        <tr>
            <th scope="col">Location Name</th>
            <th scope="col">Latitude</th>
            <th scope="col">Longitude</th>
            <th scope="col">Address</th>
            <th scope="col">Action</th>
        </tr>
    </thead>
    <tbody>

        {% for location in locations.items %}
        <tr>
            <td>{{ location.name }}</td>
            <td>{{ location.latitude }}</td>
            <td>{{ location.longitude }}</td>
            <td>{{ location.address }}</td>
            <td>
                <button type="button" class="btn btn-danger btn-sm" data-toggle="modal" data-target="#deleteLocation">
                    <i class="bi bi-trash-fill" style="font-size:18px; color: rgb(255, 255, 255);"></i>
                </button>

                <!-- Bootstrap Modal -->
                <div class="modal fade" id="deleteLocation" data-backdrop="static" data-keyboard="false" tabindex="-1"
                    aria-labelledby="deleteLocationLabel" aria-hidden="true">
                    <div class="modal-dialog">
                        <div class="modal-content">
                            <div class="modal-header">
                                <h5 class="modal-title" id="deleteLocationLabel">Delete Location</h5>
                                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                    <span aria-hidden="true">&times;</span>
                                </button>
                            </div>
                            <div class="modal-body">
                                Are you sure you would like to delete this location?
                            </div>
                            <div class="modal-footer">
                                <button type="button" class="btn btn-secondary" data-dismiss="modal">Cancel</button>
                                <form action="{{ url_for('org_settings.delete_location', location_id=location.id) }}"
                                    method="POST">
                                    <button type="submit" class="btn btn-danger">Delete</button>
                                </form>
                            </div>
                        </div>
                    </div>
                </div>
            </td>
        </tr>

        {% endfor %}

    </tbody>
</table>

<button type="button" class="btn btn-danger btn-sm" data-toggle="modal"
                    data-target="#deleteLocation-{{ location.id }}">
                    <i class="bi bi-trash-fill" style="font-size:18px; color: rgb(255, 255, 255);"></i>
                </button>```

<div class="modal fade" id="deleteLocation-{{ location.id }}" data-backdrop=" static" data-keyboard="false"
            tabindex="-1" aria-labelledby="deleteLocationLabel" aria-hidden="true">