EasyUI Forum

General Category => EasyUI for jQuery => Topic started by: jega on November 29, 2016, 03:24:47 AM



Title: Set class to only one cell in a datagrid
Post by: jega on November 29, 2016, 03:24:47 AM
Hi.

Have tried the last 4 hours to find a solution.

I'm having a datagrid with some columns and some rows. Col name 1 is "availableStatus", col name 2 is userName

In a script, i get a status on a user, runs through the datagrid's data and find row number where user match col userName.

So far so good.

Now i want to change the cell class, depending on the available status (background red, green, yellow)

How can i add this class to the cell ??



Title: Re: Set class to only one cell in a datagrid
Post by: jarry on November 29, 2016, 08:06:37 AM
You can define the column's 'styler' function to custom the cell style. Please look at this example:
http://www.jeasyui.com/demo/main/index.php?plugin=DataGrid&theme=default&dir=ltr&pitem=DataGrid%20Cell%20Style


Title: Re: Set class to only one cell in a datagrid
Post by: jega on November 29, 2016, 08:31:16 AM
Hi Jarry

Yes i know. I have used it to style an cell when loading data to the grid. This time i need to apply a class to a specific cell where already loaded data. It's a list of persons, with a cell for available status. Data is fetched by an api that tell me if the user is on/offline. Depending on status, i need to change the background color of cell to red/green.


regards Jesper


Title: Re: Set class to only one cell in a datagrid
Post by: jarry on November 29, 2016, 03:15:03 PM
After defining the styler to return the CSS class, you should call refreshRow or updateRow methods to apply the new cell style.


Title: Re: Set class to only one cell in a datagrid
Post by: zolotoy on June 21, 2018, 08:43:26 AM
So, how exactly to change an html of the specific cell at the run time?


Title: Re: Set class to only one cell in a datagrid
Post by: jarry on June 21, 2018, 05:59:59 PM
To change the cell's html, you should change the row data and refresh this row. Try to call 'refreshRow' or 'updateRow' methods.