Start Building Professional
Web Apps Today

grid - onclick change image

Hi All

I have what I hope is a question with an easy answer

I have a grid
it has the following cols

attachment | type | from | subject | date

When someone clicks on a row, I want it to replace the image in the attachment cell with a different image. The image in that cell is driven if the type is read or unread

This is my build grid

function buildGrid(){
//set grid parameters
mygrid.selMultiRows = true;
mygrid.setImagePath("../../images/grid/");
var flds = "\<img src=\"\/modules\/messages\/images\/paperclip.gif\"\>,\<img src=\"\/modules\/messages\/images\/items.gif\"\>,From,Subject,Received";
mygrid.setHeader(flds);
mygrid.setInitWidths("15,20,150,*,180")
mygrid.setColAlign("left,left,left,left,left")
mygrid.setColTypes("ed,ed,ed,ed,ed");
mygrid.setColSorting("str,str,str,str,str")
mygrid.setColumnColor("#ffffff,#ffffff,#ffffff,#ffffff,#ffffff")
mygrid.enableDragAndDrop(false);
mygrid.enableEditEvents(false,false,false,false,false); //Disables doubleclick edit ability in grid
//start grid
mygrid.init();
mygrid.loadXML("../../modules/messages/gridxml.php");
mygrid.treeToGridElement = function(treeObj,treeNodeId,gridRowId){
return [0,treeObj.getItemText(treeNodeId)];
}


Here is the gridxml.php area that pertains to that item

<?php
if ($messages_row["readstatus"]=="1")
{
?>
<cell><![CDATA[<center><img src="/modules/messages/images/openenv.gif"></center>]]></cell>
<?php
}
else
{
?>
<cell><![CDATA[<center><img src="/modules/messages/images/closedenv.gif"></center>]]></cell>
<?php
}
?>


Now, above works 100% fine when initially reading from the DB, I just need it to update the image when the item is actually opened.

Thanks again

James

You can try to use "onSelectStateChanged" event to set function called when row selected.

In order to get the cell object the following approach can be used:

    var cell = grid_object.cells(row_id,column_index).cell;

For example:

    grid.attachEvent("onSelectStateChanged", function(id){

        grid.cells(id,column_index).cell.innerHTML = '<center><img src="/modules/messages/images/closedenv.gif"></center>';

    })