PDA

View Full Version : Changing Icon in Column



Tascha
30 Oct 2009, 12:02 AM
Hello guys,

I have a column in my grid and I want to show two icons in there,
Depending on what the query of database issues.

For easier understanding I wrote a code (thats not right, but shows my problem):

Here I get the issue:




proxy: new Ext.data.HttpProxy({
url:'database.php',
method: 'GET'
}),
baseParams:{ip: ip_num, dataToshow: data_show, task: "GETALL"},
autoLoad: true,
reader: new Ext.data.JsonReader({
root:'results',
totalProperty:'total',
id: 'id'
},[
{name: 'hostname', type:'string', mapping:'hostname'},
{name: 'ipv4_addr', type:'string', mapping:'ipv4_addr'},
{name: 'ipv6', type:'string', mapping:'ipv6'},
{name: 'ondemand', type:'string', mapping:'ondemand'}, //<-----
{name: 'datetime', type:'string', mapping:'datetime'},
{name: 'result', type:'string', mapping:'result'}


............

And here's what I mean:




aktuell_ColumnModel = new Ext.grid.ColumnModel([

expander,

{


header: 'OnDemand',
dataIndex: 'ondemand',
width: 80,
sortable: true,
renderer: function(v){

if('ondemand'==1)
{


return '<img src="/images/ondemand.PNG" />';
}
else
{
return '<img src="/images/time.PNG" />';
}

}]
);



So my question is:

How can I match the two issues (only '0' and '1') of ondemand?

Some ideas would be very helpful.

Thanks

Tascha

Jaitsu
30 Oct 2009, 12:17 AM
aktuell_ColumnModel = new Ext.grid.ColumnModel([

expander,

{


header: 'OnDemand',
dataIndex: 'ondemand',
width: 80,
sortable: true,
renderer: function(v){

if(v == 1)
{


return '<img src="/images/ondemand.PNG" />';
}
else
{
return '<img src="/images/time.PNG" />';
}

}]
);

Tascha
30 Oct 2009, 12:35 AM
Thanks a lot :)

Tascha
30 Oct 2009, 1:09 AM
Hello again,

another question:

now how can I set tooltips on the icons?

I tryed it with:




ondemand_tooltip = new Ext.ToolTip({
target: 'trackCallout',
anchor: 'right',
trackMouse: true,
html: 'ondemand by user'
});



renderer: function(v){

if(v == 0)
{

return '<img src="/images/ondemand.PNG" />';
ondemand_tooltip.show();



}
else
{
return '<img src="/images/time.PNG" />';
}

}

That doesn't work... I have to link the image with the tooltipp...but I don't know how.
Only one advice would help

I promise, thats the last stupid question for today.. ;)

Jaitsu
30 Oct 2009, 4:48 AM
return '<img ext:qtitle="Title of the tip" ext:qtip="Contents of the tip" src="/images/time.PNG" />';

Tascha
2 Nov 2009, 12:47 AM
Thanks Jaitsu, but that doesn't work.

I also tried it in this way:




return '<img src="/images/time.PNG" qtip="Image tooltip" />';



But that doesn't work too..

Any idea?

greetings

Tascha

Tascha
2 Nov 2009, 12:57 AM
Ah Sorry..

My fault..
I forgot to write "Ext.QuickTips.init();"

Thanks a lot

Tascha