83.个人信息维护页面 Extjs 页面

 1 <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
 2 <%
 3 String path = request.getContextPath();
 4 String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
 5 %>
 6 
 7 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
 8 <html>
 9   <head>
10     <base href="<%=basePath%>">
11     
12     <title>角色</title>
13     
14     <meta http-equiv="pragma" content="no-cache">
15     <meta http-equiv="cache-control" content="no-cache">
16     <meta http-equiv="expires" content="0">    
17     <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
18     <meta http-equiv="description" content="This is my page">
19     <!--
20     <link rel="stylesheet" type="text/css" href="styles.css">
21     -->
22     <script type="text/javascript">
23         var username = "${user.userName}";
24         var updateFormPanel = new UpdateFormPanel(username);
25         var width = Ext.getCmp('mainTab').getActiveTab().getInnerWidth();
26          var height = Ext.getCmp('mainTab').getActiveTab().getInnerHeight();
27         var activeTab = Ext.getCmp('updateFormId');
28          if(activeTab){
29                activeTab.setWidth(width);
30                activeTab.setHeight(height);
31          }
32         activeTab.render('updateDiv');
33     </script>
34     
35   </head>
36   <body>
37       <div id="updateDiv" ></div>
38   </body>
39 </html>

  1 Ext.namespace("hrmsys.user.updatePwd");
  2 
  3 var userMark1 = true;
  4 var userMark2 = true;
  5 var userMark3 = true;
  6 UpdateFormPanel = Ext.extend(Ext.form.FormPanel, {
  7     id: 'updateFormId',
  8     constructor: function(username){
  9         Ext.form.Field.prototype.msgTarget = 'side';
 10         Ext.QuickTips.init();
 11         UpdateFormPanel.superclass.constructor.call(this, {
 12             style: 'margin-left: 30%; margin-top: 5%',
 13             items: [{
 14                  500,
 15                 xtype: 'fieldset',
 16                 title: '用户信息修改',
 17                 labelAlign: 'right',
 18                 labelWidth: 60,
 19                 layout: 'form',
 20                 padding: '10 0 0 110',
 21                 items: [{
 22                     xtype: 'textfield',
 23                     fieldLabel: '用户名',
 24                     id: 'userName',
 25                     value: username,
 26                     allowBlank: false,
 27                     name: 'user.userName',
 28                     blankText: '不能为空',
 29                     emptyText: '不能为空'
 30                 },{
 31                     xtype: 'textfield',
 32                     fieldLabel: '原密码',
 33                     id: 'oldPassword',
 34                     allowBlank: false,
 35                     blankText: '不能为空',
 36                     //validator: validatePassword
 37                     listeners: {'blur': validatePassword}
 38                 },{
 39                     xtype: 'textfield',
 40                     fieldLabel: '用户密码',
 41                     name: 'user.userPwd',
 42                     inputType: 'password',
 43                     id: 'pwd',
 44                     allowBlank: false,
 45                     blankText: '不能为空',
 46                     listeners: {'blur': pwd_blurFn}
 47                 },{
 48                     xtype: 'textfield',
 49                     fieldLabel: '再次输入',
 50                     inputType: 'password',
 51                     allowBlank: false,
 52                     blankText: '不能为空',
 53                     id: 'rePwd',
 54                     listeners: {'blur': rePwd_blurFn}
 55                 }],
 56                 buttonAlign: 'center',
 57                 buttons: [{
 58                     text: '确定',
 59                     handler: this.saveSuccessFn
 60                 },{
 61                     text: '取消',
 62                     handler: function(){
 63                         Ext.getCmp('updateFormId').getForm().reset();
 64                     }
 65                 }]
 66             }]
 67         })
 68     },
 69     saveSuccessFn: function(){
 70         var form = Ext.getCmp('updateFormId').getForm();
 71         rePwd_blurFn();
 72         pwd_blurFn();
 73         validatePassword();
 74         //判断校验是否通过，在ff下校验失败会阻止提交，在ie需自己判断
 75         if(form.isValid() && userMark1 && userMark2 && userMark3){
 76         form.submit({
 77             url: 'user_updatePwd.action',
 78             success: function(form, action){
 79                 Ext.Msg.alert('提示', action.result.msg, function(){
 80                     form.reset();
 81                 })
 82                 },
 83             failure: save_failure
 84         });}
 85     }
 86 });
 87 rePwd_blurFn = function(){
 88     var pwd = Ext.getDom('pwd').value;
 89     var rePwd = Ext.getDom('rePwd').value;
 90     if(pwd != rePwd && pwd != ""){
 91         userMark2 = false;
 92         Ext.getCmp('rePwd').markInvalid('两次输入的密码不相同');
 93     }
 94     userMark = true;
 95     if(pwd == rePwd){
 96         userMark2 = true;
 97         Ext.getCmp('rePwd').clearInvalid();
 98         Ext.getCmp('pwd').clearInvalid();
 99     }
100 };
101 pwd_blurFn = function(){
102     var pwd = Ext.getDom('pwd').value;
103     var rePwd = Ext.getDom('rePwd').value;
104     if(rePwd != "" && pwd != rePwd){
105         userMark3 = false;
106         Ext.getCmp('pwd').markInvalid('两次输入的密码不相同');
107     }
108     if(pwd == rePwd){
109         userMark3 = true;
110         Ext.getCmp('rePwd').clearInvalid();
111         Ext.getCmp('pwd').clearInvalid();
112     }
113 };
114 validatePassword = function(){
115     var oldPassword = Ext.getDom("oldPassword").value;
116     Ext.Ajax.request({
117         url: 'user_validatePwd.action',
118         params: {
119             oldPassword: oldPassword
120         },
121         success: function(response, options){
122             var datas = Ext.util.JSON.decode(response.responseText);
123             if(datas.msg == false){
124                 userMark1 = false;
125                 Ext.getCmp("oldPassword").markInvalid("原密码不正确");
126             }else{
127                 userMark1 = true;
128             }
129         }
130     })    
131 }