动态模态没有通过Ajax刷新页面

Question

我正在尝试使用基于表单输入的动态数据填充模式，而没有页面重新加载。

一步一步：

1）用户将输入一个名称和提交于admin.php的形式

2）的数据经由editUser.php

通过Ajax（理想地）提交和处理

3）数据从mysqli数据库中提取并放入模式内容中。4）Modal加载（虽然仍在查看admin.php页面），但没有页面重新加载，但动态内容在模态中。

到目前为止我的代码： 表单+阿贾克斯：

<script src="http://malsup.github.com/jquery.form.js"></script> 
      <script> 
       // wait for the DOM to be loaded 
       $(document).ready(function() { 
        // bind 'myForm' and provide a simple callback function 
        $('#myForm').ajaxForm(function() { 
         alert("Thank you for your comment!"); 
        }); 
       }); 
      </script> 
      <form id="myForm" action="query/editUser.php" method="post"> 
       Name: <input type="text" name="name" /> 
       <input type="submit" value="Submit Comment" /> 
      </form> 

editUser.php：

<script> 
    $(window).load(function(){ 
     $('#myModal').modal('show'); 
    }); 
</script> 

    <!-- Modal --> 
    <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"> 
     <div class="modal-dialog" role="document"> 
     <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">Modal title</h4> 
      </div> 
      <div class="modal-body"> 
      --List data based on the form input from before 
      </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> 
    </div> 

我现在的问题是，我不知道如何来显示模式后的形式是提交。 你会注意到我目前没有打电话给我的数据库，或者填写模式上的任何内容，因为那会晚点。我现在的目标是在表单提交之后进行模态显示（并且在显示之前仍然可以填充模态的方式进行）。

我被卡住了，一直在试图弄清楚这一点，并非常感谢帮助。

编辑：

下面是我有什么和我想要的细分。

现在，我有2页：admin.php和editUser.php

管理页面持有形式就可以了，在提交表单时使用“动作”张贴到editUser页面，其中有对我的代码模态。

当表单发布时，我希望使用while语句从数据库中提取信息来动态地填充信息（基于管理页面的输入）。

然后，我希望模式显示为管理页面上的覆盖 - 这应该都发生在绝对没有页面刷新。

我知道如何用动态信息填充模态，我知道如何调用模态，但是我不知道如何在提交表单并填充保存的模态之后在我的管理页面上显示模态动态地在userEdit页面上。

Answer 1

如果dialog是那将接收内容的<div class="modal">的ID，

$('#dialog').modal('show'); 

例如为：

$.get(url).then(function(data) { 
    // fill "#dialog .modal-body" with content based on 'data' 
    ... 

    $('#dialog').modal('show'); 
});