当前位置: 移动技术网 > IT编程>开发语言>.net > ASP.NET MVC5网站开发用户修改资料和密码(六)

ASP.NET MVC5网站开发用户修改资料和密码(六)

2017年12月12日  | 移动技术网IT编程  | 我要评论

斗战神流花蜜露,神墓之萧然,魅丽优品官网

在上一篇文章网站开发(五)中实现了用户的注销和登录,其实代码里落了点东西,就是用户登录要更新最后一次登录时间和登录ip,这次补上。今天做修改资料和修改密码,tryupdatemodel是新用到的东西。

现完善昨天的登录代码:

一、用户导航菜单
这个就是侧栏的导航,以后所有控制器中action名都为menu。目标效果如下:

先usercontroller添加menu action。直接返回分布视图。右键添加视图

<div class="panel panel-primary">
 <div class="panel-heading"><h3>我的资料</h3></div>
 <div class="panel-body">
 <ul class="nav nav-pills nav-stacked">
  <li> <a href="@url.action("details")"><span class="glyphicon glyphicon-user"> 修改资料</span></a></li>
  <li> <a href="@url.action("changepassword")"><span class="glyphicon glyphicon-log-out"> 修改密码</span></a></li>
  <li> <a href="@url.action("logout")"><span class="glyphicon glyphicon-log-out"> 退出登录</span></a></li>
 </ul>
 </div>
</div>

二、显示用户资料
再在user控制器里添加显示用户资料的action details。以后约定所有显示详细资料的动作名都为details。在控制器中返回当前用户的资料

/// <summary>
 /// 显示资料
 /// </summary>
 /// <returns></returns>
 public actionresult details()
 {
  return view(userservice.find(user.identity.name));
 }

右键添加视图

@model ninesky.models.user

@{
 viewbag.title = "我的资料";
}

<div class="row">
 <div class="col-md-3 col-sm-4">@html.action("menu")</div>
 <div class="col-md-9 col-sm-8">

 <ol class="breadcrumb">
  <li><span class="glyphicon glyphicon-home"><a> 会员中心</a></span></li>
  <li><a> 个人中心</a></li>
  <li>修改资料</li>
 </ol>

 @using (html.beginform("modify","user"))
 {
  @html.antiforgerytoken()

  <div class="form-horizontal">
  <h4>用户资料</h4>
  <hr />
  @html.validationsummary(true)
  @html.hiddenfor(model => model.userid)

  <div class="form-group">
   @html.labelfor(model => model.username, new { @class = "control-label col-md-2" })
   <div class="col-md-10">
   @html.displayfor(model => model.username)
   </div>
  </div>

  <div class="form-group">
   @html.labelfor(model => model.displayname, new { @class = "control-label col-md-2" })
   <div class="col-md-10">
   @html.editorfor(model => model.displayname)
   @html.validationmessagefor(model => model.displayname)
   </div>
  </div>

  <div class="form-group">
   <label class = "control-label col-md-2">用户组</label>
   <div class="col-md-10">
   @foreach (var _relation in model.userrolerelations){ <span>@_relation.role.name</span><br />}
   </div>
  </div>

  <div class="form-group">
   @html.labelfor(model => model.email, new { @class = "control-label col-md-2" })
   <div class="col-md-10">
   @html.editorfor(model => model.email)
   @html.validationmessagefor(model => model.email)
   </div>
  </div>
  <div class="form-group">
   <div class="col-md-offset-2 col-md-10">
   <input type="submit" value="修改" class="btn btn-default" />
   </div>
  </div>
  </div>
 }
 </div>
</div>
@section scripts {
 @scripts.render("~/bundles/jqueryval")
}

@foreach (
var _relation in model.userrolerelations){ <span>@_relation.role.name</span><br />} 这里是显示用户组名称,延迟加载。

 三、修改用户资料
显示用户资料后点击修改直接向后台提交数据,这里把接受并更新数据库的动作名也是details。在这个方法里不能直接用user做方法参数,因为我只想跟新显示名和邮箱,我如果设置user类型的参数,如果用户向服务器提交的参数中含有username,可能用户名都会改掉,这里使用tryupdatemodel来部分更新模型。

/// <summary>
 /// 修改资料
 /// </summary>
 /// <returns></returns>
 [validateantiforgerytoken]
 [httppost]
 public actionresult modify()
 {

  var _user = userservice.find(user.identity.name);
  if (_user == null) modelstate.addmodelerror("", "用户不存在");
  else
  {
  if (tryupdatemodel(_user, new string[] { "displayname", "email" }))
  {
   if (modelstate.isvalid)
   {
   if (userservice.update(_user)) modelstate.addmodelerror("", "修改成功!");
   else modelstate.addmodelerror("", "无需要修改的资料");
   }
  }
  else modelstate.addmodelerror("", "更新模型数据失败");
  }
  return view("details", _user);
 }

代码中的tryupdatemodel(_user, new string[] { "displayname", "email" }) 表示我只想从客户提交的数据中更新displayname和email
 
四、修改密码
先建立一个视图模型changepasswordviewmodel

using system.componentmodel.dataannotations;

namespace ninesky.web.areas.member.models
{
 /// <summary>
 /// 修改密码视图模型
 /// <remarks>创建:2014.02.19</remarks>
 /// </summary>
 public class changepasswordviewmodel
 {
 /// <summary>
 /// 原密码
 /// </summary>
 [required(errormessage = "必填")]
 [display(name = "密码")]
 [stringlength(20, minimumlength = 6, errormessage = "{2}到{1}个字符")]
 [datatype(datatype.password)]
 public string originalpassword { get; set; }

 /// <summary>
 /// 新密码
 /// </summary>
 [required(errormessage = "必填")]
 [display(name = "新密码")]
 [stringlength(20, minimumlength = 6, errormessage = "{2}到{1}个字符")]
 [datatype(datatype.password)]
 public string password { get; set; }

 /// <summary>
 /// 确认密码
 /// </summary>
 [required(errormessage = "必填")]
 [compare("password", errormessage = "两次输入的密码不一致")]
 [display(name = "确认密码")]
 [datatype(datatype.password)]
 public string confirmpassword { get; set; }
 }
}

然后在usercontroller中添加动作public actionresult changepassword() 直接返一个视图。右键添加changepasswordviewmodel类型的视图

@model ninesky.web.areas.member.models.changepasswordviewmodel

@{
 viewbag.title = "修改密码";
}
<div class="row">
 <div class="col-md-3 col-sm-4">@html.action("menu")</div>
 <div class="col-md-9 col-sm-8">
 <ol class="breadcrumb">
  <li><span class="glyphicon glyphicon-home"><a> 会员中心</a></span></li>
  <li><a> 个人中心</a></li>
  <li>修改密码</li>
 </ol>

 @using (html.beginform())
 {
  @html.antiforgerytoken()

  <div class="form-horizontal">
  <h4>修改密码</h4>
  <hr />
  @html.validationsummary(true)

  <div class="form-group">
   @html.labelfor(model => model.originalpassword, new { @class = "control-label col-md-2" })
   <div class="col-md-10">
   @html.editorfor(model => model.originalpassword)
   @html.validationmessagefor(model => model.originalpassword)
   </div>
  </div>

  <div class="form-group">
   @html.labelfor(model => model.password, new { @class = "control-label col-md-2" })
   <div class="col-md-10">
   @html.editorfor(model => model.password)
   @html.validationmessagefor(model => model.password)
   </div>
  </div>

  <div class="form-group">
   @html.labelfor(model => model.confirmpassword, new { @class = "control-label col-md-2" })
   <div class="col-md-10">
   @html.editorfor(model => model.confirmpassword)
   @html.validationmessagefor(model => model.confirmpassword)
   </div>
  </div>

  <div class="form-group">
   <div class="col-md-offset-2 col-md-10">
   <input type="submit" value="修改" class="btn btn-default" />
   </div>
  </div>
  </div>
 }

 @section scripts {
  @scripts.render("~/bundles/jqueryval")
 }

 </div>
</div>

在添加一个接受处理动作,代码也很简单

[validateantiforgerytoken]
 [httppost]
 public actionresult changepassword(changepasswordviewmodel passwordviewmodel)
 {
  if(modelstate.isvalid)
  {
  var _user = userservice.find(user.identity.name);
  if (_user.password == common.security.sha256(passwordviewmodel.originalpassword))
  {
   _user.password = common.security.sha256(passwordviewmodel.password);
   if (userservice.update(_user)) modelstate.addmodelerror("", "修改密码成功");
   else modelstate.addmodelerror("", "修改密码失败");
  }
  else modelstate.addmodelerror("", "原密码错误");
  }
  return view(passwordviewmodel);
 }

五、在首页显示登录、注册链接
在web的shared文件件添加loginpartial.cshtml视图文件,在用户未登录时显示登录和注册链接,登录后显示用户名。

@using microsoft.aspnet.identity
@if (request.isauthenticated)
{
 using (html.beginform("logout", "user", formmethod.post, new { id = "logoutform", @class = "navbar-right" }))
 {
 @html.antiforgerytoken()

 <ul class="nav navbar-nav navbar-right">
  <li>
  @html.actionlink("你好 " + user.identity.getusername() + "!", "manage", "account", routevalues: null, htmlattributes: new { title = "管理" })
  </li>
  <li><a href="javascript:document.getelementbyid('logoutform').submit()">注销</a></li>
 </ul>
 }
}
else
{
 <ul class="nav navbar-nav navbar-right">
 <li>@html.actionlink("注册", "register", "user", routevalues: new { area = "member" }, htmlattributes: new { id = "registerlink" })</li>
 <li>@html.actionlink("登录", "login", "user", routevalues: new {area="member"}, htmlattributes: new { id = "loginlink" })</li>
 </ul>
}

效果如下:

登录前

登陆后

 ok.现在我们可以给给member区域的usercontroller控制器和homecontroller加上[authorize]特性。并为usercontroller的注册 登录 验证码action 加上[allowanonymous]特性。

这次修改资料部分用到了部分更新模型方法tryupdatemodel,到此member区域的用户部分暂时结束。下次开始内容部分,希望大家继续关注。

如对本文有疑问,请在下面进行留言讨论,广大热心网友会与你互动!! 点击进行留言回复

相关文章:

验证码:
移动技术网