2011-08-12 27 views
2

一个Ajax登陆对话框,我使用Asp.Net MVC 3(剃刀)和jQuery/jQueryUI的创建对话框登录框。 我对这些技术还很陌生,并且遇到了问题。创建具有MVC 3和jQueryUI的

登录表单是一个局部视图,我使用下面的jQuery代码到其加载到页:

$('#log-in').click(function() { 
     if (ServerModel.UserId == 0) {//User not logged in, open login dialog 
      $("<div></div>") 
      .addClass("dialog") 
      .addClass("form-dialog") 
      .attr("id", "login-dialog") 
      .appendTo("body") 
      .dialog({ 
       title: 'LOGIN', 
       close: function() { $(this).remove() }, 
       modal: true, 
       width: 323, 
       resizable: false 
      }) 
      .load(ActionUrls.LogOn); 
     } 
    }); 

ActionUrls.LogOn,具有用于在所述控制器的登录操作方法的路径。

登录表单局部视图看起来沿着这些线路:

@using (Ajax.BeginForm(new AjaxOptions { HttpMethod = "POST", UpdateTargetId = "login-dialog" })) 
{  
    //Login form fileds in here with submit button at the end 
} 

下面是控制器代码:

[HttpGet] 
    public ActionResult LogOn() 
    { 
     return PartialView("_Logon"); 
    } 

    [HttpPost] 
    public ActionResult LogOn(LogOnModel model) 
    { 
     if (ModelState.IsValid) 
     { 
      CustomSqlMembershipProvider provider = new CustomSqlMembershipProvider(); 

      if (provider.ValidateUser(model.UserName, Security.ComputeHash(model.Password))) 
      { 
       FormsAuthentication.SetAuthCookie(model.UserName, model.RememberMe); 
       return RedirectToAction("Index", "Home");      
      } 
      else 
      { 
       ModelState.AddModelError("", "The user name or password provided is incorrect."); 
      } 
     } 

     // something failed, redisplay partial view with the model 
     return PartialView("_Logon", model); 
    } 

这一切工作正常,但我有问题,当用户通过身份验证时,可以在控制器代码中看到。我尝试使用RedirectToAction(“Index”,“Home”),这意味着页面应该在登录用户和对话框关闭的情况下重新加载。

此刻

然而,仅仅在登录对话框重新加载在它整个页面的内容。我知道这可能是正常行为,因为我在登录视图中告诉窗体更新对话框的UpdateTargetId。

所以,问题是,我可以达到我想要的整个页面重载的结果,如果是这样,如何?

任何帮助和提示,将是非常赞赏。

/奥拉

回答

0

而不是使用一个表单参数,你可以用jquerys ajax方法,并在用户名和密码,并在AJAX方法的成功函数发送如果用户认证成功redirect用户索引页。

注意索引页应该还是有办法来确定用户进行身份验证或没有其他任何人都可以typein的URL。

您认为如何?

+0

使用表单的好处是,在Asp.Net MVC中,它自己传回各种验证信息。如果你愿意接受你的建议,你必须自己去做这件事吗? –

+0

什么样的验证? – Baz1nga

+0

FYI有很多jquery库供您验证为您验证..就像http://docs.jquery.com/Plugins/validation或更多详细信息:http://zoomzum.com/useful-jquery-form-validation/ – Baz1nga

0

在您.load Ajax调用,返回的数据包含重定向信息。我不知道这是只对JSON职位,但它是值得一试:

... 
.load(ActionUrls.LogOn, function(data) { 
    if (data.redirect) { 
     window.location.href = data.redirect; 
    else { 
     // other 
    } 
}); 

更新:

,你需要连接到回调的事件是一个提交登录信息,而不是加载登录页面的信息。我问你钩住顶部的错误Ajax调用,您需要含住一个是这一个:

@using (Ajax.BeginForm(new AjaxOptions { HttpMethod = "POST", UpdateTargetId = "login-dialog" })) 
{  
    //Login form fileds in here with submit button at the end 
} 

不幸的是,我不知道如何挂钩到该事件。本文可能有所帮助: How to get an ASP.NET MVC Ajax response to redirect to new page instead of inserting view into UpdateTargetId?

+0

不,似乎没有工作。当我从对话框中发布表单时,来自加载的回调甚至没有命中。 –

+0

我给你的信息不好。我问你挂钩到加载表单的ajax事件,而不是挂在提交表单的ajax事件上。 – rkw

0

我注意到这是一个老问题,但我希望我的回复可能有助于某人。 对于类似的东西,我重定向到控制器操作中的'helper'页面,其中包含(对于我来说)只有scipt标记中的一些JavaScript(或者您应该链接它当然)。 在这种情况下,这就足够了:

window.location.href = "http://www.foo.com"; 

...我还发现并关闭该对话框有:

$('#login-dialog').dialog('close'); 

对我来说是很好的,但我也很欣赏更好的解决方案。