javascript - 如何在提交按钮上提交其他模态表单单击当前模态

Question

我有一个包含提交按钮的 Bootstrap 模态框。除了这个模态框之外，我还有另一个模态框包含表单和其他元素，如标签、文本框和提交按钮。现在我有一个要求，在其中单击提交按钮第一个模态，它应该提交第二个模态的形式..下面我发布我的第一个和第二个模态 HTML 原型(prototype)..

<div class="modal alert" id="DeleteModal" tabindex="-1" role="dialog" aria-labelledby="DeleteModalLabel" aria-hidden="true" data-backdrop="static">
<div class="modal-dialog">
    <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                <h3 class="modal-title" id="DeleteModalLabel">Confirm Delete</h3>
            </div>
        <div class="modal-body">
            <div class="form-group">
                <label class="col-sm-6 control-label">Are You Sure To Delete !!!</label>
                </div>
            </div>
            <div class="modal-footer">
                <div class="pull-right">
                    <button type="submit" class="btn btn-success"><i class="glyphicon glyphicon-trash"></i> Delete</button>
                    <button type="button" class="btn btn-danger" data-dismiss="modal"><i class="glyphicon glyphicon-remove"></i> Cancel</button>
                </div>
            </div>
    </div>
</div>

这是第二个..

<div class="modal fade" id="StudentModal" tabindex="-1" role="dialog" aria-labelledby="StudentModalLabel" aria-hidden="true" data-backdrop="static">
<div class="modal-dialog">
<div class="modal-content">
<form action="~/GetStudent" class="form-horizontal" role="form" method="post" id="frmStudent">
<div class="modal-footer">
<div class="pull-right">
                    <button type="submit" class="btn btn-success"><i class="glyphicon glyphicon-ok"></i> Save</button>
                    <button type="button" class="btn btn-danger" data-dismiss="modal"><i class="glyphicon glyphicon-remove"></i> Close</button>
                </div>
            </div>
        </form>
    </div>
</div>

请建议我这怎么可能。谢谢..

Answer 1

添加类到删除按钮

<button type="submit" class="btn btn-success delete"><i class="glyphicon glyphicon-trash"></i> Delete</button>

编写一个点击事件。

$('.delete').on('click',function(){
    $('#DeleteModal').modal('hide');
    $("#frmStudent").submit();
});

注意:这只是一个基本示例。现在，如果您想使用 ajax 提交 form，则可以通过不同的步骤来实现它。