PDA

View Full Version : Can a column display a graphic?



donalconlon
20 Sep 2006, 9:39 AM
Is it possible for acolumn to display a graphic? Either static, or based on the value in the cell?

jack.slocum
20 Sep 2006, 12:37 PM
Yes, using a renderer function.



function renderImage(value, rowIndex, colIndex){
return 'myimage.gif';
}
// then in your column model definition:
var myColumns = [
{header: "Icon", width: 20, renderer: renderImage},
...
];


Note: If you need to display big images you will have to customize the row/cell heights defined in the CSS.

techno_adi
21 Sep 2006, 11:28 PM
Can somebody explain the second part of the question "based on the value in the cell". How do i update only one row's image cell based on the value in other (assuming that the value is editable)?

Is it possible for acolumn to display a graphic? Either static, or based on the value in the cell?

jack.slocum
22 Sep 2006, 12:41 AM
You will need a reference to your DataModel to get the other cell's value.



// create your data model
var dataModel = {...}

function renderImage(value, rowIndex, colIndex){
if(value == 'foo'){
return 'foo.gif';
}else{
// get the value at row 1, column 1
var otherValue = dataModel.getValueAt(1, 1);
if(otherValue == 'bar'){
return 'bar.gif';
}else{
return 'none.gif';
}
}
}

techno_adi
22 Sep 2006, 4:53 AM
You will need a reference to your DataModel to get the other cell's value.



// create your data model
var dataModel = {...}

function renderImage(value, rowIndex, colIndex){
if(value == 'foo'){
return 'foo.gif';
}else{
// get the value at row 1, column 1
var otherValue = dataModel.getValueAt(1, 1);
if(otherValue == 'bar'){
return 'bar.gif';
}else{
return 'none.gif';
}
}
}


i tried this out, it works great..
But when i tried doing
var otherValue = dataModel.getValueAt(rowIndex, 1);
it flags an error as to
this.data[rowIndex] is not a valid property ( for yui-ext.js file)

jack.slocum
22 Sep 2006, 10:59 AM
The rowIndex, colIndex parameters appear to be additions in the new version. I thought they were present in the old version but they are not.

The version will be out on Monday and has these parameters.