1、效果

说明:1、界面不太美观 这里面主要是包括 利用jQuery 插件validate验证form字段,jQuery提交form表单的方式

1、HTML代码

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>
<link href="Easyui/themes/default/easyui.css" rel="stylesheet" />
<link href="Easyui/themes/icon.css" rel="stylesheet" />
<script src="Easyui/jquery-1.7.2.min.js" type="text/javascript"></script>
<script src="Easyui/jquery.easyui.min.js"></script>
<script src="Easyui/locale/easyui-lang-zh_CN.js"></script>
<script src="JS/jquery.validate.min.js"></script>
<script src="JS/jquery.form.js"></script>
<style type="text/css">
.div1
{
width:350px;
height:160px;
}
td
{
text-align:right;
}
.input1
{
width:180px;
}
</style> </head>
<body>
<form id="form1" runat="server">
<input type="hidden" name="userId" value=""/>
<div class="div1">
<table>
<tr><td>用户名:</td><td><input class="input1" type="text" id="userName" name="userName" value="" /></td></tr>
<tr><td>旧密码:</td><td><input class="input1" type="password" id="pwd" name="pwd" value="" /></td></tr>
<tr><td>新密码:</td><td><input class="input1" type="password" id="NewPwd" name="NewPwd" value="" /></td></tr>
<tr><td>确认新密码:</td><td><input class="input1" type="password" id="confirmPwd" name="confirmPwd" value="" /></td></tr>
<tr><td id="btnCaoZuo" style="padding-right:20px;width:160px;" colspan="2">
<input type="button" style="width:80px;margin-right:15px;" onclick="test()" value ="保存" />
<input type="button" style="width:80px;" value="取消" /></td></tr>
</table>
</div>
</form>
</body>
</html>
<script type="text/javascript"> function check_form() { return $("#form1").validate({
rules: {
userName: {
required: true,
minlength: 2
},
NewPwd: {
required: true,
minlength: 6,
maxlength: 20,
},
confirmPwd: {
required: true,
minlength: 6,
maxlength: 20,
equalTo: "#NewPwd"
} },
messages: {
userName: {
required: "请输入用户名",
minlength: "用户名必需由两个字母组成"
},
NewPwd: {
required: "请输入密码",
minlength: "密码长度不能小于 6 个字母",
maxlength: "密码长度不能多于 20 个字母",
},
confirmPwd: {
required: "请输入密码",
minlength: "密码长度不能小于 6 个字母",
maxlength: "密码长度不能多于 20 个字母",
equalTo: "两次密码输入不一致"
} }
});
}
function test()
{
if (check_form().form()) {
var f = $('#form1');
f.form('submit', {
url: 'Home/ChangePWD',
type: 'post',
success: function (data) {
var json = $.parseJSON(data);
if (json.id == 1) { } },
error: function (data) { } });
return true; } else { return false; } }
</script>

2、Home控制器 代码

        public ActionResult ChangePWD()
{
ResultModel re = new ResultModel();
string userName = Request["userName"].ToString();
re.id = ;
re.stName = "修改成功!";
return Json(re, JsonRequestBehavior.AllowGet);
}

3、引用的Easyui 及js源文件下载地址

链接:https://pan.baidu.com/s/1UDrd5KKB4kN3tN_0CotA4A 密码:tctv

asp.net mvc4 修改密码界面的更多相关文章

  1. Dynamics CRM修改密码界面

    我们再实施Dynamics CRM的过程中经常会被客户吐槽没有一个修改密码的页面.市面上也有一些人通过自己操作AD库进行修改密码的解决方案不过多多少少会有一些BUG存在.其实ADFS提供了一个修改密码 ...

  2. asp.net membership 修改密码

    aspnet_Applications 存储数据库所涉及应用程序有关信息. aspnet_Membership 存储与用户相关信息例如:用户登陆密码,创建时间. aspnet_Paths 存储应用程序 ...

  3. winform设计一个登录界面和修改密码的界面-自动切换窗体(问题[已解] 望一起讨论)(技术改变世界-cnblog)

    http://www.cnblogs.com/IAmBetter/archive/2012/01/14/2322156.html winform设计一个登录界面和修改密码的界面-自动切换窗体(问题[已 ...

  4. C#_会员管理系统:开发三(修改密码)

    为以后多个功能界面考虑,新增一个主界面: 主界面如下: 主界面(VIPMain.cs)详细代码如下: using System; using System.Collections.Generic; u ...

  5. 31、Flask实战第31天:cms后台修改密码

    cms后台修改密码界面布局 先创建cms_resetpwd.html页面,继承cms_base.html {% extends 'cms/cms_base.html' %} {% block titl ...

  6. vue-element添加修改密码弹窗

    1.新建修改密码vue文件CgPwd.vue 代码如下: <template> <!-- 修改密码界面 --> <el-dialog :title="$t('c ...

  7. 在ASP.NET MVC4中实现同页面增删改查,无弹出框02,增删改查界面设计

    在上一篇"在ASP.NET MVC4中实现同页面增删改查,无弹出框01,Repository的搭建"中,已经搭建好了Repository层,本篇就剩下增删改查的界面了......今 ...

  8. asp.net mvc4 登录界面

    说明:开发环境 asp.net mvc4 c#语言 1.项目目录结构 2.Login控制器中 public ActionResult Index() { return View(); } 对应Inde ...

  9. ASP.NET MVC5 网站开发实践(二) Member区域 - 用户部分(3)修改资料、修改密码

    在上一篇博客中实现了用户的注销和登录,其实代码里落了点东西,就是用户登录要更新最后一次登录时间和登录IP,这次补上.今天做修改资料和修改密码,TryUpdateModel是新用到的东西. 目录: AS ...

随机推荐

  1. es6总结(三)--数组

  2. luogu 1325 雷达安装

    题目链接 题意 在\(x\)轴上方有\(n\)个海岛,要在\(x\)轴建雷达,每个雷达的覆盖范围为半径为\(d\)的圆,问至少要建多少个雷达能覆盖所有海岛. 思路 对于每个海岛计算出雷达建立在什么范围 ...

  3. LeetCode OJ--Merge Two Sorted Lists

    http://oj.leetcode.com/problems/merge-two-sorted-lists/ 有序链表的归并排序 #include <iostream> using na ...

  4. 关于TS返回 Can't use function return value in write context 问题

    在项目开发过程中,出现某一接口文件间歇性出现500错误,间歇性出现说明是有条件才会产生,查看错误日志显示:Fatal error: Can't use function return value in ...

  5. ASP.NET Core 中间件基本用法

    ASP.NET Core 中间件 ASP.NET Core的处理流程是一个管道,而中间件是装配到管道中的用于处理请求和响应的组件.中间件按照装配的先后顺序执行,并决定是否进入下一个组件.中间件管道的处 ...

  6. luogu P1510 精卫填海

    题目描述 [版权说明] 本题为改编题. [问题描述] 发鸠之山,其上多柘木.有鸟焉,其状如乌,文首,白喙,赤足,名曰精卫,其名自詨.是炎帝之少女,名曰女娃.女娃游于东海,溺而不返,故为精卫.常衔西山之 ...

  7. javaScript 时间转换,将后台返回的时间为一串数字转成正常格式

    js完整代码: function transferTime(cTime){ var jsonDate = new Date(parseInt(cTime)); Date.prototype.forma ...

  8. numpy常用函数学习

    目录numpy常用函数学习点乘法线型预测线性拟合裁剪.压缩和累乘相关性多项式拟合提取符号数组杂项点乘法该方法为数学方法,但是在numpy使用的时候略坑.numpy的点乘为a.dot(b)或numpy. ...

  9. 第四章——SQLServer2008-2012资源及性能监控(1)专家

    http://blog.csdn.net/dba_huangzj/article/details/8614817

  10. 投影纹理映射(Projective Texture Mapping) 【转】

    摘抄“GPU Programming And Cg Language Primer 1rd Edition” 中文名“GPU编程与CG语言之阳春白雪下里巴人”  投影纹理映射( Projective ...