Code:
Ext.QuickTips.init();
Ext.apply(Ext.form.VTypes, {
password: function (val, field) {
if (field.initialPassField) {
var pwd = Ext.getCmp(field.initialPassField);
return (val == pwd.getValue());
}
return true;
},
passwordText: 'What are you doing?<br/>The passwords entered do not match!'
});
var signupForm = {
xtype: 'form',
id: 'register-form',
labelWidth: 125,
bodyStyle: 'padding:15px;background:transparent',
border: false,
url: 'save-form.php',
items: [{
xtype: 'box',
autoEl: {
tag: 'div',
html: '<div class="app-msg"><img src="img/businessmanadd.png" class="app-img" />Register for The Magic Forum</div>'
}
},
{
xtype: 'textfield',
id: 'email',
fieldLabel: 'Email',
allowBlank: false,
minLength: 3,
maxLength: 64,
anchor: '90%',
vtype: 'email'
},
{
xtype: 'textfield',
id: 'pwd',
fieldLabel: 'Password',
inputType: 'password',
allowBlank: false,
minLength: 6,
maxLength: 32,
anchor: '90%',
minLengthText: 'Password must be at least 6 characterslong.'
},
{
xtype: 'textfield',
id: 'pwd-confirm',
fieldLabel: 'Confirm Password',
inputType: 'password',
allowBlank: false,
minLength: 6,
maxLength: 32,
anchor: '90%',
minLengthText: 'Password must be at least 6 characterslong.',
vtype: 'password',
initialPassField: 'pwd'
}],
buttons: [{
text: 'Register',
handler: function () {
Ext.getCmp('register-form').getForm().submit();
}
},
{
text: 'Cancel',
handler: function () {
win.hide();
}
}]
}
Ext.onReady(function () {
win = new Ext.Window({
layout: 'form',
width: 340,
autoHeight: true,
closeAction: 'hide',
items: [signupForm]
})
toolbar = new Ext.Toolbar({
//renderTo:'form-ct',
items: [{
xtype: 'tbbutton',
text: 'Bottone Ricerca',
handler: function () {
win.show();
///insert here de code for call the panel and insert it into center region
}
}]
})
var viewport = new Ext.Viewport({
layout: 'border',
renderTo: Ext.getBody(),
items: [{
region: 'north',
split: false,
items: [toolbar],
xtype: 'panel',
height: 29,
//html: 'North'
},
{
region: 'west',
split: false,
xtype: 'panel',
split: true,
width: 0,
html: 'West'
},
{
region: 'center',
xtype: 'panel',
html: '<div> </div>'
},
{
region: 'east',
xtype: 'panel',
split: true,
width: 0,
html: '0'
},
{
region: 'south',
xtype: 'panel',
html: 'South'
}]
});
})
Show panel in viewport after press button
with format code
