时间戳

首页 > 解决方案 > 单独文件上的引导模式不会关闭

php - 单独文件上的引导模式不会关闭

问题描述

我正在使用bootstrap中的模态。模式打开，但没有使用十字或关闭按钮关闭。

这是我的index.php文件中的内容：

<div id="editar" class="modal fade" role="dialog" tabindex="-1" aria-hidden="true">
</div>

这是一个单独的.php文件中的模式：

<div class="modal-dialog modal-lg">
        <div class="modal-content">
            <div class="modal-header">
                <h4 class="modal-title">Editar Accion</h4>
                <button type="button" class="close" data-dismiss="modal" id="cerrar">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body">
                <input type="hidden" name="editar" value="<?php echo $id; ?>">
                <div class="form-group">
                    <label for="item_name">Accion:</label>
                    <input type="text" class="form-control" id="accion" value="<?php echo $accion; ?>">

                </div>
            </div>
        <div class="modal-footer">
                <button type="button" class="btn btn-primary mb-3" name="update" id="btn-editar"><span class="glyphicon glyphicon-edit"></span> Editar</button>
                <button type="button" class="btn btn-secondary mb-3" data-dismiss="modal"><span class="glyphicon glyphicon-remove-circle"></span> Cancelar</button>
            </div>
    </div>
</div>

我必须将它们保存在两个文件中。

标签： phphtmlcssbootstrap-4

解决方案

我认为最好使用它，JQuery以便您可以更好地控制关闭时模式上发生的事情（例如：清除字段等）。

$(document).on('click','#button_id',function(e){
   e.preventDefault();
   //you can clear fields first if you need to
   $('#accion').val('');
   $('#modal_id').hide(); //close modal
});

请记住将文件包含在index.php. 将模态保存在单独的文件中将有助于您在代码中的某处重用相同的内容，也就是说，如果您保持模态代码足够动态。

推荐阅读