Matic Kukovec
Matic Kukovec

Reputation: 436

Cell outside virtual DOM cannot be accessed?

I have a quite deep nested Tabulator table which has automatic virtual DOM enabled (the default behaviour), which is about 50 rows. The table is inside wrapped inside a div with a fixed height of 500px. When trying to access an element outside the view with for example this:

row = self.table.getRows(row_index)
cell_element = row.getCell(column_index).getElement()

I get the error:

row.getCell(...).getElement is not a function

To find if I was doing something wrong, I looped over all rows in the table and the above example works for all visible rows plus a few rows above and below, but not for the non-visible ones. Any ideas what is happening here?

What I'm trying to achieve is to loop through all rows and check if a specific cell index in each row contains a certain string, to set the text weight to bold for that cell with:

row = self.table.getRows(row_index)
cell_element = row.getCell(5).getElement()
cell_element.style["fontWeight"] = "bold"

Upvotes: 0

Views: 317

Answers (1)

Lil Devil
Lil Devil

Reputation: 733

To allow for cells to be created and destroyed by the virtual DOM, you need to use a custom formatter.

{title:"Name", field:"name", formatter:function(cell, formatterParams, onRendered){
    if (cell.getValue() === 'Look at me') {
        cell.getElement().style.fontWeight = 'bold';
    }
    return cell.getValue();
}

Upvotes: 1

Related Questions