how to target row action div from field

  • 1
  • Problem
  • Updated 3 years ago
Photo of mB Pat Vachon

mB Pat Vachon, Champion

  • 42,714 Points 20k badge 2x thumb

Posted 3 years ago

  • 1
Photo of Pablo Martinez

Pablo Martinez

  • 2,468 Points 2k badge 2x thumb
You are close :p

I tried that myself, but it was impossible from a custom renderer access the buttons in that row.

what I did at the end is add a class to the tr and then define an style for that the icon in the tr with this class:

JS: custom renderer:

skuid.ui.fieldRenderers[field.metadata.displaytype][field.mode](field,value);
 field.item.element.addClass(rowactionClass); //Important!!! after the renderer.


css:

table.nx-skootable-data tbody tr.[YOURROWACTIONCLASS] td div.[CLASSOFTHEICON]{background: green;}
Photo of mB Pat Vachon

mB Pat Vachon, Champion

  • 42,714 Points 20k badge 2x thumb
Hey Pablo,

That hit the mark and makes for a clean implementation.

Do you know why I couldn't target the row action directly from the field renderer snippet?

Thanks,

Pat
Photo of Pablo Martinez

Pablo Martinez

  • 2,468 Points 2k badge 2x thumb
I suspect the HTML entities are not in the Dom (or correctly wrapped) when the renderer is executed.

The renderers maybe create js objects (or an xml markup) assigned to the tr and when all the table is defined (filters, row actions, fields...) is drawn. But this is what I think.