Question

我有一个bootstrap模式，它填充了另一个文件的表单，如下所示：

HTML：

<div class="modal fade" id="myModal" 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-label="Close"><span aria-hidden="true">&times;</span></button>
            <h4 class="modal-title" id="myModalLabel">Invoice</h4>
        </div>
        <div class="modal-body">
            ...
        </div>
        <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            <button type="button" class="btn btn-primary">Save changes</button>
        </div>
    </div>
</div>

的javascript：

// Fill modal with content from link href
$("#myModal").on("show.bs.modal", function(e) {
    var link = $(e.relatedTarget);
    $(this).find(".modal-body").load(link.attr("href"));
});

页面中某处的HTML链接：

<a data-remote='false' data-toggle='modal' data-target='#myModal' href='submit1.php' class='btn btn-info btn-xs btn-block'>Invoice</a>

submit.php是一个表单：

<form action="" id="form1" method="post">
  First name:<br>
  <input type="text" name="firstname" value="">
  <br>
  Last name:<br>
  <input type="text" name="lastname" value="">
  <br><br>
  <input type="submit" id="submit1" value="Submit">
</form>

上面的代码工作正常。将submit1.php加载到模态后，我希望该表单的提交按钮执行以下操作：

提交表单数据
在相同或新的模态窗口中加载响应（响应将是新表单）

我该怎么做？使用新的href或使用ajax。

bootstrap modal打开新的bootstrap模式

0 个答案: