Flask添加删除前确认模态框，如何将ID传递给删除函数实现功能？

实现方案 #

你只需要将选中的ID临时存储到模态框的自定义属性中，点击确认按钮时读取该属性传给删除函数即可，总共需要修改两处代码：

1. 修改send_to_modal函数，存储ID到模态框 #

给模态框添加自定义data-target-id属性存储选中的ID，修改后代码如下：

function send_to_modal(id){
    // 原有逻辑：将ID显示到模态框标题，不需要可以删掉
    document.getElementById("exampleModalLabel").innerHTML = id;
    // 新增逻辑：存储ID到模态框的自定义属性
    document.getElementById("exampleModal").setAttribute('data-target-id', id);
};

2. 适配删除函数调用逻辑，获取存储的ID #

二选一即可：

• 方案A：修改modal_a_funccion函数，自动读取ID（不需要改模态框代码）

function modal_a_funccion(){
    // 读取模态框中存储的目标ID
    const targetId = document.getElementById("exampleModal").getAttribute('data-target-id');
    console.log("Solicitando un report para: "+targetId);
    fetch('/task/report_celery/' + targetId).then(function(response) {
        response.json().then(function(data) {
            for (var x of data.ip) {
                console.log("REPORT_fetch recibe (IP): " +x.ip_oob)
                console.log("REPORT_fetch recibe (ESTADO): " +x.estado)
            };
        });
    });
    // 可选：删除完成后自动关闭模态框（Bootstrap5环境可用）
    // bootstrap.Modal.getInstance(document.getElementById('exampleModal')).hide();
};

• 方案B：修改模态框确认按钮的调用逻辑，主动传参（不需要改原删除函数）
  修改模态框footer里的确认按钮代码：

<button type="button" class="btn btn-success" onclick="modal_a_funccion(document.getElementById('exampleModal').getAttribute('data-target-id'))">SI</button>

内容的提问来源于stack exchange，提问作者Kentron.dna