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

时间:2015-11-02 07:34:34

标签: javascript jquery html forms twitter-bootstrap

我有一个包含提交按钮的Bootstrap模式。除了这个模态我还有另一个包含表单和其他元素,如Lables,文本框和提交按钮。现在我有一个要求,点击提交按钮第一个莫代尔,它应该提交第二模态的形式。我将发布我的第一和第二模态HTML原型..

<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>

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

1 个答案:

答案 0 :(得分:1)

class添加到delete button

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

写一个click event

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

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