Question

我正在使用bootstrap模态，在里面我有一个表单。我希望模式在表单提交后保持打开状态，但它会关闭。我已经检查过向按钮添加一个弹出框（这不起作用）强制在模态关闭之前显示一条消息。

有没有办法让它保持开放？我想在提交后向用户显示确认。在旧帖子中找不到任何答案。

也许我必须在提交后在视图中呈现不同的模板？这是FORM POST中的按钮定义：

<form action="" method="POST">
<button type="submit" class="btn btn-default">Add</button>

我还尝试添加：onclick =“$（'＃{{p.id}}'）。modal（{'backdrop'：'static'}）;”

有什么想法吗？感谢。

Answer 1

如此扩展以发送ajax请求

标记

<!-- Button to trigger modal -->
    <a href="#myModal" role="button" class="btn btn-custom" data-toggle="modal">Open Form</a>
    <!-- Modal -->
    <div id="myModal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
        <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>
            <h4 class="modal-title">My Form</h4>
        </div>
        <div class="modal-body">
            <form id="my-form">
                <div class="form-group">
        <label class="control-label col-md-4" for="first_name">First Name</label>
        <div class="col-md-6">
            <input type="text" class="form-control" id="first_name" name="first_name" placeholder="First Name"/>
        </div>
    </div>
    <div class="form-group">
        <label class="control-label col-md-4" for="last_name">Last Name</label>
        <div class="col-md-6">
            <input type="text" class="form-control" id="last_name" name="last_name" placeholder="Last Name"/>
        </div>
    </div>
        <button type="submit" id="submit-form" class="btn btn-default">Save</button>
            </form>

        </div><!-- End of Modal body -->
        </div><!-- End of Modal content -->
        </div><!-- End of Modal dialog -->
    </div><!-- End of Modal -->

<强> Jquery的

$(document).on('submit','#my-form',function(event){    
    event.preventDefault()
    var formData = $(this).serialize();
    console.log(formData);
    $.ajax({
        url: "", // some php
        data: formData,
        datatype: "json",
        type: "POST",
        success: function(data) {}
   });
});

示例http://jsfiddle.net/lgtsfiddler/WBnRV/17/

按钮操作提交后，保持在引导模式屏幕上

1 个答案: