How to add html class to a table ROW, or programmatically to a CELL?

he

healyhatman 27 Apr, 2018

As in the title : is there a way to add a class to a particular ROW in a table, or to an individual cell? So I can for example apply a negative/positive class or a colour to either?

See https://semantic-ui.com/collections/table.html#positive--negative for an example of what I'm after

he

healyhatman 07 May, 2018

Bump, would very much like this please.

Ni

NickOg 23 Jul, 2018

Hi

Sorry for delay - just spotted your query.

Is this CSS what you need?


tbody tr.even td {
  background: none repeat scroll 0 0 whitesmoke !important;
}

That produces this

he

healyhatman 23 Jul, 2018

No. I need to be able to add the CLASS to the row or cell to be able to target it with CSS and there's no way (currently that I can see) to add it in CCv6

Ni

NickOg 24 Jul, 2018

Hi - just realised that you are down the road from me - up in Port.
I have used the class box in the Table view to apply classes to th and td tags. Any help?

he

healyhatman 24 Jul, 2018

no. Row and cell not column.

Ni

NickOg 24 Jul, 2018

That example above - that includes css configuration for the row (the shading) and cell (the badge) does it not?

he

healyhatman 24 Jul, 2018

and how are you going to add the class to the row or cell? As in

<td class = "myclass">

Ni

NickOg 24 Jul, 2018

Via that column classes box.

That generates

And I added the div colours as an HTML function on the columns view.

he

healyhatman 24 Jul, 2018

Okay so I need it programmatically. So for example, if classFee is 1.5 then add "classA" to the row. If classFee is 2 add "classB" to the cell.

Ni

NickOg 24 Jul, 2018

Yes - pro grammatically. I used this approach

<div class='clsBadge' 
style='color:{var:masterYears.row.mdlMasterYears.badgeDisplayText} !important;  
border:solid medium {var:masterYears.row.mdlMasterYears.badgeDisplayText} !important;'>
{var:masterYears.row.mdlMasterYears.intYear}
</div>

rather than maintain a set of classes but that would no doubt work if you could anticipate all of the likely values,

he

healyhatman 24 Jul, 2018

Thanks for the input but again I need it added to the cell or individual row itself.

Ni

NickOg 24 Jul, 2018

OK

And there I am stuck since as far as I can see and from my usage that method does add css to a specific cell admittedly via the tag style attribute based on the cell content.
😶
Nick

he

healyhatman 24 Jul, 2018

No you're adding a class to content INSIDE the cell.

Ni

NickOg 24 Jul, 2018

OK - I see that difference. I shall ponder further - it needs some sort of css:parent selector. I wonder if one can add a {fn:...} to the Column Classes box or the Columns Views box.

Nick

he

healyhatman 24 Jul, 2018

There is no css parent selector, and even if there was that's still not what I need. I want to utilise Semantic-UIs table behaviour for positive / negative cell entries.

I'll probably just have to see if I can modify the PHP files for CC and add the requisite options to the table builder.

Ni

NickOg 24 Jul, 2018

No - there is not for reasons explained elsewhere - but a pity.
I shall watch with interest.

he

healyhatman 25 Jul, 2018

Answer

OK I got it. I modified table_config to add a row option and table_output to display it. You can add text classes in there or function calls - but for some reason if you call a PHP function it has to echo your class string instead of returning the string.

[file=10801]table_config.php.txt[/file]
[file=10802]table_output.php.txt[/file]

USAGE: remove the '.txt' and upload the files to /server/path/public_html/yoursite/libraries/cegcore2/admin/extensions/chronofc/views/table
REMEMBER: These additions will be overwritten when you update chronoforms/connectivity.

Ni

NickOg 25 Jul, 2018

Thanks for that.

Noted 'REMEMBER: These additions will be overwritten when you update chronoforms/connectivity.'

he

healyhatman 25 Jul, 2018

This just adds the class to the ROW though not individual cells. I can do that later but for my purposes the row was more important.

Ni

NickOg 25 Jul, 2018

Perhaps Max will pick up and add to the base set.

he

healyhatman 25 Jul, 2018

I sent my code to him via email. Hopefully he'll make a nicer version of it and add it in.

Tw

Twincarb 11 Oct, 2018

@healyhatman,

Can you provide an example of putting this into action, with one of my tables I wish to colour a row depending on a value that isn't displayed on the table but is held within the function that is being displayed.
I presume that I would be looking at a php routine to check if the row contains the required value and then outputs the class based on it.
I have no idea if this is achievable or not, within the Functions area I have only ever used the read database functions!

he

healyhatman 11 Oct, 2018

{fn:some function}

The data you need should be stored in $this->get("table_name.row.model.field", "default");

Forums

How to add html class to a table ROW, or programmatically to a CELL?