如何在提交表单后重新加载页面

7

我有一个包含表单的Bootstrap模态框。模态框还包含提交和取消按钮。取消按钮正常工作,可以成功关闭模态框。现在根据我的要求,在模态框的提交按钮点击时,表单通过将用户输入传递到Web服务成功提交,但模态框没有关闭。此外,我需要在提交按钮点击事件上重新加载页面。以下是我的HTML代码:

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

我尝试了以下方法来关闭模态框...

$('#frmStudent').submit(function() {
$('#StudentModal').modal('hide');
return false;
});

根据我的要求,我需要在提交事件后关闭模态窗口,并在从 Web Service 返回后重新加载页面。如何使用 Jquery 实现?
注意:我不能在此处使用 Ajax 调用..我只能从表单操作中提交表单。

@Jordan.J.D 那个问题使用了Ajax,我没有使用Ajax,在表单操作中,我提供了服务URL..在这种情况下该怎么做.. - Lara
嘿@Lara,使用Ajax有什么问题吗?Jordan.J.D发布的链接中的解决方案似乎很好。 - Lakshman Pilaka
我的负责人说不要使用Ajax,所以这里不能使用。这是这个项目的一种约定。 - Lara
你不能在客户端通过AJAX提交来完成这个操作。浏览器将根据Web服务器对你的POST请求的响应进行操作。因此,你需要让服务器响应一个重定向。 - jsphpl
如果 $('#StudentModal').modal('hide'); 不起作用,请尝试使用 $('#StudentModal').modal('toggle'); 希望能帮到你。 - Braian Mellor
显示剩余3条评论
3个回答

17

这个 HTML 不会起作用:

<form onsubmit="window.location.reload();">

但是这个 HTML 可以完成工作:

<form onsubmit="setTimeout(function(){window.location.reload();},10);">

所以浏览器有足够的时间提交表单,然后重新加载页面 ;-)


1
@Carl Poole:感谢您的编辑! - adilbo

5
提交表单后,您可以通过JavaScript直接调用以下代码:
window.location.reload();

0
如果您想在提交表单时重新加载页面,请使用 onsubmit 事件处理程序:
document.getElementById("frmStudent").onsubmit = function(){
    location.reload(true);
}

这段代码应该重新加载页面,提交表单并关闭模态框。


网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接