Adding colored labels inline

Fabris

I am using this beautiful DataTables in my database, and I love how fast it is.
I have setup something like a inbox, and everything is fine with data, but I now need to replicate 3 or 4 labels, colored, aside the row.
These labels are about the single row's priority, sentiment, assign, and so on.

How to build a similar structure, to add (or leave blank( these labels?
Labels are not clickable, just to show a character.
Must add div's ? But where?

kthorngren

You can use columns.render to generate the HTML for the cell. See this example.

Kevin

Fabris

I tried but I can change the font color or the background for the whole row.
I have a single cell, that contains from 1 to 4 boxes, every one with a different color, or hidden.
So I must change a single field of the row in a 4 div's fields, always in the same row, and change colors of any of these boxes.
I am not able to split a single box/field in multiple boxes, even using html, but I am sure I am wrong somewhere.
I am trying again, anyway. I am sure that if therer is a solution, I will find it!

kthorngren

Here is another example. It creates two buttons in the cell.
http://live.datatables.net/qemodapi/506/edit

I tried but I can change the font color or the background for the whole row.

You can use createdRow for this. See this example.

Use columns.render to render elements into the cell. Use createdRow to apply styling to the row.

If you need help please update my example or create a test case showing what you are trying to do.
https://datatables.net/manual/tech-notes/10#How-to-provide-a-test-case

Kevin

Fabris

Really thank you for your support, I am trying to add your buttons one above the other, in the same row.
The row is a single email, and have more than one buttons/labels: you gave a perfect example, but I must keep all the buttons in the same row. If not, I have too widht row for each email.

The second problem is to grab data from JSON, because I am building this page inside a Filemaker database, but I think I have already solved.

kthorngren

I am trying to add your buttons one above the other, in the same row.

A simple solution is to use </br> between the buttons like this:
http://live.datatables.net/qemodapi/849/edit

Aligning the buttons the way you want just needs standard HTML and CSS options to be applied. Datatables doesn't control this.

Kevin