使用bootstrap 3模式框确认删除 [英] confirm delete using bootstrap 3 modal box

问题描述

我需要使用bootstrap 3模式框确认删除（是/否）。如何创建这个？

i need to confirm delete using bootstrap 3 modal box(YES/NO). how do can create this?

HTML代码：

<form action ="<?php echo $URL .'/admin/privileges.php?action=editable' ?>" method="POST">
<button class='btn btn-danger btn-xs' type="submit" name="remove_levels" value="delete"><span class="fa fa-times"></span> delete</button></td>
</form>

推荐答案

工作演示http://jsfiddle.net/L3ddq/1/

您需要在HTML中使用模态。当删除按钮被点击时，它弹出模态。防止点击该按钮提交表单也很重要。点击确认后，即可提交表单。

You need the modal in your HTML. When the delete button is clicked it pops the modal. It's also important to prevent the click of that button from submitting the form. When the confirmation is clicked, that submits the form.

<form action ="<?php echo $URL .'/admin/privileges.php?action=editable' ?>" method="POST">
<button class='btn btn-danger btn-xs' type="submit" name="remove_levels" value="delete"><span class="fa fa-times"></span> delete</button>
</form>

<div id="confirm" class="modal hide fade">
  <div class="modal-body">
    Are you sure?
  </div>
  <div class="modal-footer">
    <button type="button" data-dismiss="modal" class="btn btn-primary" id="delete">Delete</button>
    <button type="button" data-dismiss="modal" class="btn">Cancel</button>
  </div>
</div>

jQuery

$('button[name="remove_levels"]').on('click', function(e){
    var $form=$(this).closest('form'); 
    e.preventDefault();
    $('#confirm').modal({ backdrop: 'static', keyboard: false })
        .one('click', '#delete', function() {
            $form.trigger('submit'); // submit the form
        });
        // .one() is NOT a typo of .on()
});

这篇关于使用bootstrap 3模式框确认删除的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！