如何在Power Portal父页面调用Bootstrap模态框内的dbSave函数？

方法1：利用Bootstrap模态框内置事件触发保存 #

Bootstrap 3的模态框提供了hidden.bs.modal事件，会在模态框完全关闭后触发，可通过该事件获取当前模态框的上下文，进而调用内部的dbSave函数：

$(document).ready(function () {
    $(document).on('hidden.bs.modal', '.modal', function() {
        var modalContext = $(this)[0];
        // 检查函数存在并执行
        if (modalContext.dbSave && typeof modalContext.dbSave === 'function') {
            modalContext.dbSave();
        }
    });
});

注意：需要将模态框内的dbSave函数挂载到全局上下文（模态框的window对象），不能是局部作用域函数，修改模态框内的脚本如下：

// 模态框内的脚本
window.dbSave = function() {
    // 你的数据库保存逻辑代码
};

方法2：拦截关闭按钮行为，先保存再关闭 #

如果要监听关闭按钮点击事件，可先阻止默认的关闭动作，执行保存后再手动关闭模态框：

$(document).ready(function () {
    $(document).on('click', '[data-dismiss="modal"]', function(e) {
        e.preventDefault(); // 阻止默认关闭行为
        var $currentModal = $(this).closest('.modal');
        var saveFunction = $currentModal[0].dbSave;
        
        if (saveFunction && typeof saveFunction === 'function') {
            saveFunction();
            // 保存完成后手动关闭模态框
            $currentModal.modal('hide');
        } else {
            // 找不到函数时直接关闭
            $currentModal.modal('hide');
        }
    });
});

同样需要保证模态框内的dbSave函数挂载到window对象上，避免因局部作用域导致父页面无法访问。

原调用失败原因 #

之前使用child.dbSave()报错，是因为child变量未正确指向模态框上下文，且模态框内的dbSave如果是局部作用域定义的函数（比如嵌套在$(document).ready()内），父页面无法直接访问。只有将函数暴露到模态框的全局window对象，父页面才能通过模态框元素关联到该函数。

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