0

ExtJS 4.1.1a

简单的授权表格(登录和密码)。

与带有输入的标准 html 表单不同,即使浏览器也不会提示保存输入的登录名和密码值。

示例代码:http: //jsfiddle.net/AllanStark/mKMfh/1/

Ext.create('Ext.window.Window', {
  title: 'Test',
  height: 430,
  width: 335,
  bodyPadding: '20 0 0 0',
  draggable: false,
  resizable: false,
  closable: false,
  layout: {
    type: 'vbox',
    align: 'center'
  },
  bodyStyle: {
    background: '#FFFFFF'
  },
  items: [{
    xtype: 'image',
    width: 150,
    height: 150,
    src: 'images/logo.gif'
  },{
    xtype: 'form',
    url: 'login.php',
    standardSubmit: true,
    border: 0,
    width: 170,
    padding: '20 0 20 0',
    defaultType: 'textfield',
    layout: 'vbox',
    fieldDefaults: {
      labelAlign: 'top',
      msgTarget: 'qtip',
      width: '100%'
    },
    items: [{
      xtype:'textfield',
      fieldLabel: 'Login',
      name: 'login',
      allowBlank: false
    },{
      xtype:'textfield',
      fieldLabel: 'Password',
      name: 'pass',
      inputType: 'password',
      allowBlank: false,
      listeners: {
        specialkey: function(field, e){
          if (e.getKey() == e.ENTER) {
            var form = field.up('form').getForm();
            form.submit();
          }
        }
      }
    }],
    buttons: [{
      text: 'Ok',
      formBind: true,
      disabled: true,
      handler: function() {
        var form = this.up('form').getForm();
        form.submit();
      }
    },{
      text: 'Reset',
      handler: function() {
        this.up('form').getForm().reset();
      }
    }]
  }]
}).show();​
4

1 回答 1

0

要打开密码对话框,html-attribute 自动完成必须是“on”。在 Extjs 中它的“关闭”并且没有任何方法可以将其更改为“解决方法”。所以将此事件添加到密码和用户名的侦听器中:

后渲染:函数(cmp){
   cmp.inputEl.set({
       自动完成:'开'
   });
}
Ext.create('Ext.window.Window', {
  标题:'测试',
  身高:430,
  宽度:335,
  bodyPadding: '20 0 0 0',
  可拖动:假,
  可调整大小:假,
  可关闭:假,
  布局: {
    类型:'vbox',
    居中对齐'
  },
  身材: {
    背景:'#FFFFFF'
  },
  项目: [{
    xtype:'图像',
    宽度:150,
    身高:150,
    src:'图像/logo.gif'
  },{
    xtype:'形式',
    网址:'login.php',
    标准提交:真,
    边界:0,
    宽度:170,
    填充:'20 0 20 0',
    默认类型:'文本字段',
    布局:'vbox',
    字段默认值:{
      标签对齐:'顶部',
      msgTarget: 'qtip',
      宽度:'100%'
    },
    项目: [{
      xtype:'文本域',
      fieldLabel: '登录',
      名称:'登录',
      允许空白:假,
      听众:{
        // ------
        后渲染:函数(cmp){
            cmp.inputEl.set({
                 自动完成:'开'
            });
       }
       // ------
      }
    },{
      xtype:'文本域',
      fieldLabel: '密码',
      名称:'通过',
      输入类型:'密码',
      允许空白:假,
      听众:{
        特殊键:函数(字段,e){
          if (e.getKey() == e.ENTER) {
            var form = field.up('form').getForm();
            form.submit();
          }
        },
        // ------
        后渲染:函数(cmp){
            cmp.inputEl.set({
                 自动完成:'开'
            });
       }
       // ------
      }
    }],
    纽扣: [{
      文字:“好的”,
      表单绑定:真,
      禁用:真,
      处理程序:函数(){
        var form = this.up('form').getForm();
        form.submit();
      }
    },{
      文本:'重置',
      处理程序:函数(){
        this.up('form').getForm().reset();
      }
    }]
  }]
}).show();​

于 2013-01-03T11:10:17.400 回答