beego与ajax异步提交

最近在使用beego开发自己的小网站，前端我采用ajax异步提交数据，具体实现为：

简化的表单：

<form action="">
<div style="margin:5px 0px;">
 <input id="username" type="text" />
 </div>
<div style="margin:5px 0px;">
<input id="password" type="password"/ >
</div>
<button type="button"  onclick="SubmitRegistInfo()">
注<span style="width:20px;"></span>册</p>
</button>
</form>

 

js程序：

<script type="text/javascript">
function SubmitRegistInfo()
{
    var UserName = document.getElementById("username").value;
    var PassWord = document.getElementById("password").value;
     $.ajax({
        async: false,
        type:"POST",
        url:"/register/handler",
        data:{"username":UserName,"password":PassWord}
        }).done(function(msg){
        if(msg.Val != null)
        {
            window.location.href="/"
        }
    });
}

</script>

 

beego路由处理：

beego.Router("/register/handler", &controllers.LoginController{}, "POST:RegisterInfo")

 

处理请求和相应：

func (c *LoginController) RegisterInfo() {
    username, password := c.GetString("username"), c.GetString("password")
    result := struct {
        Val string
    }{username}
    c.Data["json"] = &result
    c.ServeJSON()   //响应前端
    beego.Debug("username:", username, password)

}

 

这样就可以实现数据提交了。

这里我实现的时候遇到几个问题：

   （1）async: false

   ajax默认的提交方式是异步的，也就是async: true，这个时候如果代码直接这样写：

<script type="text/javascript">
function SubmitRegistInfo()
{
    var UserName = document.getElementById("username").value;
    var PassWord = document.getElementById("password").value;
     $.ajax({
        type:"POST",
        url:"/register/handler",
        data:{"username":UserName,"password":PassWord}
        }).done(function(msg){
         if(msg.Val != null)
        {
            window.location.href="/"
        }
    });
}

</script>

这个时候当代码执行到$.ajax这里的时候是不会阻塞的，因为是异步，所以执行$.ajax这里代码的同时还会继续往下执行接下里的代码，

但是$.ajax后面没有代码，则此函数结束，内存释放，这样$.ajax的post请求就会没有处理完函数就释放了，回调函数失效，达不到我们预期的效果。

所以这里我们把async: 设置为false，即为同步请求，则执行$.ajax这里的代码的时候会阻塞，一直等请求处理完才会接着往下执行。

（2）还有个问题是表单的<button type="button"  这个要是“button”才行，不要写成“submit”,不然

window.location.href="/"

页面跳转会失效。

转载于:https://my.oschina.net/spotless/blog/751241