.net c#防止部分失败时重新加载整个页面-登录注册

prevent full page reload when partial fail - login register
2021-09-14
  •  译文(汉语)
  •  原文(英语)

我在mvc 4应用程序中创建了一个页面来管理登录和注册任务.当我使用注册创建用户时,注册失败(例如密码不匹配)时,页面会处理错误并刷新,但会在注册的renderaction部分插入完整的页面.

另一方面,当登录失败-用户不存在-页面刷新,但将用户定向到仅显示renderaction登录部分而不显示整个布局的页面.

步骤:我创建了一个模型

public class Access
{
    public LoginModel LoginModel { get; set; }
    public RegisterModel RegisterModel { get; set; }
}

然后我创建一个页面:

<div class="main-content" style="min-height: 700px;">
    <!-- Login form -->
    @{ Html.RenderAction("Login", "Account"); }

    <!-- Register form -->
    @{ Html.RenderAction("Register", "Account"); }
    <div class="clear"></div>
</div>

该控制器是mvc4模板中提供的典型控制器.登录示例

public ActionResult Login(LoginModel model, string returnUrl)
{
    if (ModelState.IsValid && WebSecurity.Login(model.UserName, model.Password, persistCookie: model.RememberMe))
    {
        if (Url.IsLocalUrl(returnUrl))
        {
            return Redirect(returnUrl);
        }
        else
        {
            return RedirectToAction("Index", "Home");
        }
    }

    // If we got this far, something failed, redisplay form
    ModelState.AddModelError("", "The user name or password provided is incorrect.");
    return PartialView(model);
}
解决过程1

如果失败,您将返回ParitalView,则可能需要返回包含整个页面的视图.即 编辑

//recreate the compound viewmodel in the login controller
 Access viewModel = new Access();
 viewModel.LoginModel = model;
 viewModel.RegisterModel = new RegisterModel();
return View("LoginOrRegister", viewModel); //supposing the view name is LoginOrRegister.cshtml

//recreate the compound viewmodel in the register controller
 Access viewModel = new Access();
 viewModel.LoginModel = new LoginModel();
 viewModel.RegisterModel = model;
 return View("LoginOrRegister", viewModel); //supposing the view name is LoginOrRegister.cshtml

同样,loginorregister.cshtml页面将必须使用包含LoginModel和RegisterModel的Access类作为View的模型,即.@模型访问

在呈现登录或注册模型时,您需要传递模型参数-这样用户就无需重新输入数据.*编辑-还要尝试从RenderAction更改为Html.RenderPartial(),以使其不会通过初始渲染的动作进行路由-为此,并在控制器上添加[HttpPost]注释*代码看起来像

@model Access
<div class="main-content" style="min-height: 700px;">
<!-- Login form -->
@{ Html.RenderPartial("Login", new {model = Model.LoginModel, returnUrl = "?"}) };

<!-- Register form -->
@{ Html.RenderPartial("Login", "Account", new { model = Model.RegisterModel) }; }
<div class="clear"></div>
</div>

[HttpPost]
public ActionResult Login(LoginModel model, string returnUrl) 
{
    if (ModelState.IsValid && WebSecurity.Login(model.UserName, model.Password, persistCookie:     model.RememberMe))
    {
    if (Url.IsLocalUrl(returnUrl))
    {
        return Redirect(returnUrl);
    }
    else
    {
        return RedirectToAction("Index", "Home");
    }
}

// If we got this far, something failed, redisplay form
ModelState.AddModelError("", "The user name or password provided is incorrect.");

//recreate the compound viewmodel in the login controller
Access viewModel = new Access();
viewModel.LoginModel = model;
viewModel.RegisterModel = new RegisterModel();
return View("LoginOrRegister", viewModel);
}

嗯,您也不必使用viewbag最初传递数据,而必须使用模型传递数据-因为我选择在razor视图中使用代码"@Model Acesss",因此注册ActionResult看起来像...

public ActionResult Register(){
    Access viewModel = new Access();
    viewModel.LoginModel = new LoginModel();
    viewModel.RegisterModel = new RegisterModel();
    return View("LoginOrRegister",viewModel);
} 

我没有意识到您对MVC这么陌生.继续吧.:)另一个教程可能会有所帮助

速聊1:
谢谢,一切似乎都是正确的.但是我收到以下错误消息:"传递到字典中的模型项的类型为'LoginModel',但是此字典需要模型类型的'Access'.return View("LoginOrRegister",model);必须插入loginorregister或在登录和注册控制器?.谢谢!
速聊2:
'return View("LoginOrRegister",model)'必须同时插入两者中.啊.我犯了一个错误,因为您将不得不重新创建访问视图模型.我将编辑答案,等等
速聊3:
嗯,我真的没有想到您正在使用renderaction,嗯,还需要思考.您可能想分开回发和非回发电话?
速聊4:
我会根据您的实现mvc4beginner.com/Sample-Code/Authentication-Authorization/…建立的此信息
速聊5:
正确,请确保使用RenderPartial而不是RenderAction

I create a single page to manage login and registration task in my mvc 4 app. when i create a user using registration, and registration fails - eg password mismatch - the page process the error and refresh but inserting a complete page in the renderaction part of register.

on the other hand, when login fail - user not exists - the page refresh but direct the user to a page displaying only the renderaction login part, not the whole layout.. any help appreciated:

steps: I created a model

public class Access
{
    public LoginModel LoginModel { get; set; }
    public RegisterModel RegisterModel { get; set; }
}

then I create a page:

<div class="main-content" style="min-height: 700px;">
    <!-- Login form -->
    @{ Html.RenderAction("Login", "Account"); }

    <!-- Register form -->
    @{ Html.RenderAction("Register", "Account"); }
    <div class="clear"></div>
</div>

the controller is the typical one provided in mvc4 template. an example for login

public ActionResult Login(LoginModel model, string returnUrl)
{
    if (ModelState.IsValid && WebSecurity.Login(model.UserName, model.Password, persistCookie: model.RememberMe))
    {
        if (Url.IsLocalUrl(returnUrl))
        {
            return Redirect(returnUrl);
        }
        else
        {
            return RedirectToAction("Index", "Home");
        }
    }

    // If we got this far, something failed, redisplay form
    ModelState.AddModelError("", "The user name or password provided is incorrect.");
    return PartialView(model);
}
Solutions1

You're returning a ParitalView on fail, you may want to return the view that contains the whole page. ie edit

//recreate the compound viewmodel in the login controller
 Access viewModel = new Access();
 viewModel.LoginModel = model;
 viewModel.RegisterModel = new RegisterModel();
return View("LoginOrRegister", viewModel); //supposing the view name is LoginOrRegister.cshtml

//recreate the compound viewmodel in the register controller
 Access viewModel = new Access();
 viewModel.LoginModel = new LoginModel();
 viewModel.RegisterModel = model;
 return View("LoginOrRegister", viewModel); //supposing the view name is LoginOrRegister.cshtml

also the loginorregister.cshtml page will have to use the Access class that encompasses both the LoginModel and RegisterModel as the model for the View, ie. @model Access

And when you render the login or register model, you need to pass in the model parameters - so that the user doesn't need to re-enter data. *edit - Also try changing from RenderAction to Html.RenderPartial() so that it doesn't route through the actions for the intial render - do this and add [HttpPost] annotations on the controllers * the code would look something like

@model Access
<div class="main-content" style="min-height: 700px;">
<!-- Login form -->
@{ Html.RenderPartial("Login", new {model = Model.LoginModel, returnUrl = "?"}) };

<!-- Register form -->
@{ Html.RenderPartial("Login", "Account", new { model = Model.RegisterModel) }; }
<div class="clear"></div>
</div>

and

[HttpPost]
public ActionResult Login(LoginModel model, string returnUrl) 
{
    if (ModelState.IsValid && WebSecurity.Login(model.UserName, model.Password, persistCookie:     model.RememberMe))
    {
    if (Url.IsLocalUrl(returnUrl))
    {
        return Redirect(returnUrl);
    }
    else
    {
        return RedirectToAction("Index", "Home");
    }
}

// If we got this far, something failed, redisplay form
ModelState.AddModelError("", "The user name or password provided is incorrect.");

//recreate the compound viewmodel in the login controller
Access viewModel = new Access();
viewModel.LoginModel = model;
viewModel.RegisterModel = new RegisterModel();
return View("LoginOrRegister", viewModel);
}

ah, also instead of using the viewbag to initially pass in the data, you'd have to pass it in using the model - because I've elected to use the code "@Model Acesss" in the razor view, so the register ActionResult would look like...

public ActionResult Register(){
    Access viewModel = new Access();
    viewModel.LoginModel = new LoginModel();
    viewModel.RegisterModel = new RegisterModel();
    return View("LoginOrRegister",viewModel);
} 

I didn't realize you were so new to mvc. Keep at it. :) Another tutorial may help

Talk1:
thanks, everything seems to be correct. but I receive the following error "The model item passed into the dictionary is of type 'LoginModel', but this dictionary requires a model item of type 'Access'. return View("LoginOrRegister", model); must be inserted in loginorregister or in login and in register controller?. thanks!
Talk2:
'return View("LoginOrRegister", model)' would have to be inserted into both. ahh. I made a mistake in that you're going to have to re-create an access viewmodel. I'll edit the answer, hang on
Talk3:
ah, I didn't really think about that you're using renderaction, hmm, still need to think. you may want to seperate out the postback and the non postback calls?
Talk4:
im following this information founded based on your implementation mvc4beginner.com/Sample-Code/Authentication-Authorization/…
Talk5:
right, make sure to use RenderPartial instead of RenderAction
转载于:https://stackoverflow.com/questions/15593274/prevent-full-page-reload-when-partial-fail-login-register

本人是.net程序员,因为英语不行,使用工具翻译,希望对有需要的人有所帮助
如果本文质量不好,还请谅解,毕竟这些操作还是比较费时的,英语较好的可以看原文

留言回复
我们只提供高质量资源,素材,源码,坚持 下了就能用 原则,让客户花了钱觉得值
上班时间 : 周一至周五9:00-17:30 期待您的加入