I am trying to add an Image to a cell in the WebGrid using javascript. The image does not show up.
Here is my code snippet:
var grid = igtbl_getGridById(gridid); var rowCount = grid.Rows.length; var i = 0; if(rowCount > 0) { for( i = 0; i < rowCount; i++ ) { if(grid.Rows.getRow(i).getCellFromKey("data").getValue() == strData) { grid.Rows.getRow(i).getCellFromKey("Img").BackgroundImage = "../images/warning.gif"; grid.Rows.getRow(i).getCellFromKey("Img").CssClass="warningOnGrid"; } } }
How do you apply these style settings for the cell so they are not removed after the next asynchronous post back? I can't remember.
You will probably also want to set
Element.style.backgroundRepeat = "no-repeat";Element.style.backgroundPosition = "center center";
Moved to WebGrid forum.
Hello,
There is no clientside method off of the cell object that will handle adding of images. So, we must dig into the cells element (TD) in order to change it. Here is a code snippet.
grid.Rows.getRow(i).getCellFromKey("Img").Element.style.backgroundImage = "url(./ig_home_d.gif)";
or:
grid.Rows.getRow(i).getCellFromKey("Img").Element.innerHTML= "<img src='./ig_home_d.gif'/>)";
The first will set the actual backgroundImage property of the Style object. The second will actually replace the html for the cell. The first will still display text from the cell and the second will not. It all depends on what you want to do. Hope this helps.
Infragistics