Conditional Row Color in Alpha Table

[Aseema]

I’m trying to change the row color in an Alpha Table when the delinked field in the row data is true. Is there any way to apply conditional styling to each rows in Alpha based on field values ?

[Eldho]

@vaibhav @Irfan_Ali @Paul_Thomas @gaurav.pandey Please help

[vaibhav]

@Aseema

Highlight Table Column Based on Cell Value

This snippet demonstrates how to dynamically highlight cells in a column (e.g. "delinked") based on their value (e.g. "true"). This is useful for applying conditional formatting in a table inside a Shadow DOM.

Example Usage

// Step 1: Get the table inside shadowRoot using your utility method
const table = ap.$("table-id", "shadowRoot");

// Step 2: Find the index of the column with header name 'delinked'
const columnIndex = Array.from(table.querySelectorAll("table th"))
  .findIndex(th => th.textContent.trim().toLowerCase() === "delinked");

if (columnIndex !== -1) {
  // Step 3: Select all row elements and map to the target column's <td>
  const cells = Array.from(table.querySelectorAll("table tr.row-container"))
    .map(tr => tr.querySelector(`td:nth-child(${columnIndex + 1})`));

  // Step 4: Apply conditional styles
  cells.forEach(cell => {
    if (cell?.textContent.trim().toLowerCase() === "true") {
      cell.style.color = "red";
      cell.style.backgroundColor = "green";
    }
  });
}

---