PDA

View Full Version : Update images in a panel



brazhuca
24 Jun 2011, 4:40 AM
Hi all,

I am using ext 3.3 and I have a problem to update images dynamically in a panel.
The form is working correctly, the image is being sent correctly to the server.
The problem is simply to update the panel with the new photo after sending it. (When I press F5, the picture is updated).

FormPanel code:


// Form used for add/edit the users
App.UserForm = Ext.extend(Ext.form.FormPanel, {
layout: 'fit',
fileUpload: true,

initComponent:function() {

this.items = {
xtype: 'tabpanel',
activeTab: 0,
enableTabScroll: true,
deferredRender: false,
layoutOnTabChange: true,
items:[{
xtype: 'UserData',
userId: this.userId
}]
};

this.buttons = [{
text: t['Save'],
scope: this,
handler: this.submit
}];

App.UserForm.superclass.initComponent.apply(this, arguments);
},

submit: function() {
this.getForm().submit({
url: App.url+'/edit',
waitTitle: t['Please wait...'],
waitMsg: t['Sending...'],
scope: this,
success: this.updatePicture,
failure: this.onFailure,
params: {
userId: this.userId
}
});
return true;
},

updatePicture: function(form, action) {
var f = this.getForm();

if (action.result.data.hasPicture == 1) {
var dc = '?_dc=' + new Date().getTime();
Ext.getCmp('user-picture').getBottomToolbar().setVisible(true);
Ext.getCmp('user-picture').body.update('<img src="'+App.baseUrl+'/app/web/upload/user/'+this.userId+'/'+this.userId+'.gif"'+dc+' />');
} else {
var g = (f.findField('gender').getValue() == 1) ? 'm' : 'f';
Ext.getCmp('user-picture').body.dom.innerHTML = '<img src="'+App.baseUrl+'/app/web/img/default/user-avatar-'+g+'.gif" />';
}
}
User panel code:


// User data
App.UserData = Ext.extend(Ext.Panel, {
autoScroll: true,

initComponent:function() {

var userPicture = new Ext.Panel({
id: 'user-picture',
cls: 'form-default-pic',
width: 152,
bbar: {
hidden: true,
items: [{
text: t['Remove this picture'],
iconCls: 'removePictureBtn',
handler: this.removePicture
}]
}
});

App.UserData.superclass.initComponent.apply(this, arguments);
}
Any help would be greatly appreciated.

skirtle
24 Jun 2011, 6:40 AM
dc is on the wrong side of the double quote that ends the src attribute.

brazhuca
26 Jun 2011, 2:10 PM
OMG.. I cant belive that.
I spent two days trying to make this work .. reading the documentation .. and the solution was simpler than I thought. :D

Thank you very much Skirtle.