PDA

View Full Version : [RESOLVED] Refreshing html option of a panel



senacle
14 Aug 2009, 5:37 AM
I select a data from a combo.
Then, i would like that the html option of a panel were refreshed.
But it's never refreshed.

The panel



.....
new Ext.Panel({
layout: 'anchor',
items:[{
title: 'Panel 1',
height: 100,
bodyStyle: 'background-color: #4E79B2;',
items:[
{
id: 'idjs_maj',
html: 'Html content to update'
},
......


The code when selecting in the combo



listeners: {
select': {fn:
function(){
Rebour("'date1'", "'date2'", Ext.getCmp('idjs_maj'));
}
}
}


The function "Rebour"



function Rebour(date_maj, date_prochaine, div) {
.......
date_dif = "Updated html content";
div.html = date_dif;
.......
}

Animal
14 Aug 2009, 5:40 AM
Read and think about your code.

What does Ext.getCmp("some id here") return?

You MUST know this to use Ext.

What can just setting a member property of whatever that thing is do?

Animal
14 Aug 2009, 5:41 AM
And "The panel" that you have is a Panel in a Panel in a Panel!

Why would you do that?

senacle
14 Aug 2009, 5:51 AM
Read and think about your code.

What does Ext.getCmp("some id here") return?

You MUST know this to use Ext.


I think it returns an object, isn't it ?

And this object has some option, like html.



What can just setting a member property of whatever that thing is do?

Sorry, i don't understand what you mean.

Animal
14 Aug 2009, 6:09 AM
An object? Everything is an object. Functions, Strings, DOM elements, the browser window, Ext Components.

This is an object based language with weak typing.

So you must know what class of object you are dealing with, and perform valid actions upon it.

Just inventing the concept that some unknown "object" has an "option" like html is crazy. You are inventing random bits of code.

I ask again, and you can find this out. What does Ext.getCmp return?

senacle
14 Aug 2009, 6:27 AM
I've already used Ext.getCmp :



Ext.getCmp('idjs_debut').allowBlank = false;


where idjs_debut is the id of a textfield, and it's working.

So why it can be the same for the html option of a panel ?

I will rest my brain this week-end and try to find some explanation next week, with your help and patience.
Thanks.

Animal
14 Aug 2009, 7:12 AM
That's just an internal flag used by the field's processing at the time it performs validation.

In a language like Javascript which has no private members, and can enforce no getters and setters, there is no guarantee that setting a property will have an affect. It's just setting a variable, that's all.

The property needs to be processed.

Configuration options are processed at construction time.

If you want to update the body (http://extjs.com/deploy/ext-3.0.0/docs/?class=Ext.Panel&member=body) of a Panel, you will have to perform a method on it.

seowebmaster
14 Aug 2009, 7:38 AM
getCmp('idjs_debut').allowBlank = false

you can set to true, and try putting the alert('alert u want');

hendricd
14 Aug 2009, 8:03 AM
Interesting SPAM approach B)

Animal
14 Aug 2009, 8:18 AM
Duh!

I fink I'll click on vat link....

(What do they think we are?)

hendricd
14 Aug 2009, 8:19 AM
So much for the '_______-oriented programming' spam controls. ;)

Animal
14 Aug 2009, 8:19 AM
I got rid of his rubbish.

senacle
18 Aug 2009, 5:47 AM
Interesting SPAM approach B)

Do you think i want to built a spam site ?

Not in my idea....I'm working for my boss....

Lukman
18 Aug 2009, 5:50 AM
Do you think i want to built a spam site ?

Not in my idea....I'm working for my boss....
I think henricd is commenting on seowebmaster's spam post ...

but anyway, the keyword for the solution to your problem is "Ext.getCmp('id').getEl().dom.innerHTML" ;)

senacle
18 Aug 2009, 5:57 AM
That's just an internal flag used by the field's processing at the time it performs validation.

In a language like Javascript which has no private members, and can enforce no getters and setters, there is no guarantee that setting a property will have an affect. It's just setting a variable, that's all.

The property needs to be processed.

Configuration options are processed at construction time.

If you want to update the body (http://extjs.com/deploy/ext-3.0.0/docs/?class=Ext.Panel&member=body) of a Panel, you will have to perform a method on it.


Ok, i think i made confusion between html tag and the Extjs html option.


I've found something which does what i want. Maybe not clean code, but it's working.

The panel


.....
new Ext.Panel({
layout: 'anchor',
items:[{
title: 'Panel 1',
height: 100,
bodyStyle: 'background-color: #4E79B2;',
items:[
{
html: '<div id=\'idjs_maj\'>html content to update</div>'
},
......
The code when selecting in the combo


listeners: {
select': {fn:
function(){
Rebour("'date1'", "'date2'", document.getElementById('idjs_maj'));
}
}
}

The function "Rebour"


function Rebour(date_maj, date_prochaine, div) {
.......
date_dif = "Updated html content";
div.innerHTML = date_dif;
.......
}