用extjs4做个登录框

原来用extjs 3做过登录框,但是extjs 4对与键盘事件有些不大一样了,在旧版本中通过“keys”实现按“Enter”登录,在extjs 4中就不可以这样子做了。习惯性贴出代码:

 

 

 1         Ext.onReady(function () {
 2             Ext.tip.QuickTipManager.init();
 3             var loginForm = Ext.widget('form', {
 4                 title: '用户登录',
 5                 labelWidth: 60,
 6                 monitorValid: true,
 7                 frame: true,
 8                 bodyStyle: 'padding:5px 5px 0',
 9                 width: 300,
10                 url: '/account/logon',
11                 defaults: {
12                     anchor: '100%',
13                     allowBlank: false,
14                     msgTarget: 'side',
15                     labelWidth: 60
16                 },
17                 defaultType: 'textfield',
18                 renderTo: 'login',
19                 items: [{
20                     fieldLabel: '用户名',
21                     name: 'userName',
22                     allowBlank: false
23                 }, {
24                     fieldLabel: '密码',
25                     inputType: 'password',
26                     name: 'password',
27                     allowBlank: false,
28                     enableKeyEvents: true,
29                     listeners: {
30                         specialkey: function (fied, e) {
31                             if (e.getKey() == e.ENTER) {
32                                 loginForm.onLogin();
33                             }
34                         }
35                     }
36                 }],
37                 buttons: [{
38                     text: '登录',
39                     formBind: true,
40                     handler: function () {
41                         loginForm.onLogin();
42                     }
43                 }, {
44                     text: '重置',
45                     handler: function () {
46                         this.up('form').getForm().reset();
47                     }
48                 }],
49                 onLogin: function () {
50                     var form = loginForm.getForm();
51 
52                     if (form.isValid()) {
53                         form.submit({
54                             waitTitle: '用户登录',
55                             waitMsg: '正在登录',
56                             success: function (form, action) {
57                                 loginForm.setVisible(false);
58                                 window.location = '@ViewBag.ReturnUrl';
59                             },
60                             failure: function (form, action) {
61                                 Ext.Msg.alert('用户登录', '登录失败');
62                             }
63                         });
64                     }
65                 }
66             });
67         });

 

posted @ 2011-09-04 16:47  TerryLiang  阅读(2753)  评论(0编辑  收藏  举报