如何通过编程方式关闭bs模态?

时间:2017-12-06 11:28:20

标签: php jquery bootstrap-modal opencart-3

我自定义OpenCart 3 通过单击页面页脚中的按钮,将打开一个包含iframe的模态面板,如下所示:

<footer>
    <div class="container">
        <div class="content">
            <i class="fa fa-plus-circle" aria-hidden="true" data-toggle="modal" data-target="#myModal"></i>
            <div class="modal fade bd-example-modal-lg" id="myModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
                <div class="modal-dialog" role="document">
                    <div class="modal-content">
                        <div class="modal-body">
                            <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times-circle" aria-hidden="true"></i></button>
                            <iframe width="100%" height="{{ img_h }}" src="{{ addnewpro }}"></iframe>
                        </div>
                    </div>
                </div>
            </div>      
        </div>

iframe包含一个用于输入位于管理面板中的新产品的php页面。

到目前为止一切正常!问题是我无法在输入新产品并保存后找到关闭已打开的modal(#myModal)的方法。我尝试了许多不同的方法,包括会话等。

我在php页面中添加产品后创建了会话:

$this->session->data['newprosaved'] = 'saved';

我在页脚的php页面中查看了会话:

if (isset($this->session->data['newprosaved'])) {
     $data['saved'] = $this->session->data['newprosaved'];
     unset($this->session->data['newprosaved']);
}

然后尝试在footer.twig中访问它:

<script type="text/javascript"><!--
$(document).ready(function() { 
    if ('{{ saved }}'  == 'saved' && $('#myModal').hasClass('in')) {
        $('#myModal').modal('hide');

        $('#myModal').remove();
    }
});
</script>

但它不起作用!
还有其他方法吗?

1 个答案:

答案 0 :(得分:0)

不幸的是答案很简单,虽然浪费了我几个小时的时间。

我在保存项目后创建了一个会话:

$this->session->data['newprosaved'] = 'saved';

然后在php页面加载(内部iframe)中撤消它:

if (isset($this->session->data['newprosaved'])) {
    $data['newprosaved'] = $this->session->data['newprosaved'];
    unset($this->session->data['newprosaved']);
}

我向iframe添加了一个javascript代码:

if ('{{ newprosaved }}' == 'saved') {
    window.parent.closeModal();
}

然后javascript closeModal功能到父页面:

window.closeModal = function(){
        $('#myModal').modal('hide');
};