PDA

View Full Version : codeUrl ?



softball
27 May 2014, 12:58 AM
Dear ?
I had try a image verify sample?

there is the code as to define?
codeUrl:Ext.BLANK_IMAGE_URL,

and call it agin?
loadCodeImg: function() {
// this.codeEl.set({ src: this.codeUrl + '?id=' + Math.random() });
this.codeEl.set({ src: this.codeUrl + '?id=1' });
}


but?I can't see where is the image.
I tried use chrome debug , find it as:
data:image/gif;base64,R0lGODlhAQABAID/AMDAwAAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==?id=1

so,Where can I find the path?
By the way?is there any imgae for image verify in Extjs 4.2.1?
thx.

-----------------------------------CheckCode.js


Ext.define('CheckCode',{
extend:'Ext.form.field.Text',
alias: 'widget.checkcode',
inputTyle:'codefield',
codeUrl:Ext.BLANK_IMAGE_URL,
isLoader:true,
onRender:function(ct,position){
this.callParent(arguments);
this.codeEl = ct.createChild({ tag: 'img', src: Ext.BLANK_IMAGE_URL});
this.codeEl.addCls('x-form-code');
this.codeEl.on('click', this.loadCodeImg, this);

if (this.isLoader) {this.loadCodeImg() };
},
alignErrorIcon: function() {
this.errorIcon.alignTo(this.codeEl, 'tl-tr', [2, 0]);
},
loadCodeImg: function() {
// this.codeEl.set({ src: this.codeUrl + '?id=' + Math.random() });
this.codeEl.set({ src: this.codeUrl + '?id=1' });
}

})


-----------------------------------Login.js


Ext.define('Login',{
extend:'Ext.window.Window',
alias: 'widget.loginForm',
requires: ['Ext.form.*','CheckCode'],
initComponent:function(){
var checkcode = Ext.create('CheckCode',{
cls : 'key',
fieldLabel : 'Verify',
name : 'CheckCode',
id : 'CheckCode',
allowBlank : false,
isLoader:true,
blankText : 'Verify not EMPTY',
//codeUrl: 'Login_ck.js',
width : 160
})

var form = Ext.widget('form',{
border: false,
bodyPadding: 10,
fieldDefaults: {
labelAlign: 'left',
labelWidth: 55,
labelStyle: 'font-weight:bold'
},
defaults: {
margins: '0 0 10 0'
},
items:[{
xtype: 'textfield',
fieldLabel: 'ID',
blankText : 'ID NOT EMPTY',
allowBlank: false,
width:240
},{
xtype: 'textfield',
fieldLabel: 'Password',
allowBlank: false,
blankText : 'Password NOT EMPTY',
width:240,
inputType : 'password'
},checkcode],
buttons:[{
text:'Login',
handler:function(){ }
},{
text:'cancel',
handler:function(){ }
}]
})

Ext.apply(this,{
height: 160,
width: 280,
title: 'Login SAMPELE',
closeAction: 'hide',
closable : false,
iconCls: 'login',
layout: 'fit',
modal : true,
plain : true,
resizable: false,
items:form
});

this.callParent(arguments);
}
});

-----------------------------------4.10.php


<script type="text/jscript">

requires:['Login'];
Ext.onReady(function(){
var win;
win = Ext.create('Login');
win.show();
});
</script>