Question

我有一个带有表单并且成功提交并获得成功消息的bootstrap模式，假设我想添加一个指向同一模态的链接，以从当前的open模式加载相同的表单。

当我点击隐藏模态的链接时。

这是我链接到模态的链接。

<a class="registerBtn" data-toggle="modal" href="#registerModalForm" >Register</a>

由于

Answer 1

我接近这个的方法是将表单数据放在一个隐藏的div中（让我们称之为formData），它与模态div完全分开。例如：

<div id="formData" class="hide">
   <form href="#" action="post">
      Name: <input id="nameText" type="text"/>
      <a href="#" id="mySubmit" class="btn btn-primary">Submit</a>
   </form>
</div>

然后创建一个事件，这样当模态显示时，它会将表单数据加载到模态的主体中：

$("#myModal").on("show", function() {
    // load the modal with content from the div formData
    $(".modal-body", this).html($("#formData").html());
});

然后最后，向重新加载表单的按钮添加一个事件（此处按钮的id = myReload：

$("body").on('click', 'a.btn-primary', function() {
      // A button with the class btn-primary was clicked. If this is the reload button
      // reload the HTML into the modal
      if ($(this).attr("id") == "myReload") {
                 $(this).parent().html($("#formData").html());
      }
});

JSFiddle here。（忽略提交按钮的代码，这只是为了模拟表单提交）。

在第一个提交后加载相同的twitter bootstrap模式

1 个答案: