Custom Row Color in the nuxeo-data-table

__9 — Sun, 04 Dec 2016 19:53:57 GMT

Hello,

First, thank you for your work 🙂

I would like to custom each row color of the data-table but I have a problem, I can collect each row and add a new class (with the new color) but the color change **after ** the table was full. So, each time all rows have the wrong color (the previous color). What can i do ?

Below, my code :

//Listener on the event "nuxeo-page-loaded", it's fire by the table
listeners: {
	'nuxeo-page-loaded': 'updateOccurrenceColor'
},
  
  
 //The function to search all rows and update the color
updateOccurrenceColor: function() {
	this.dataRows = this.$.dataModuleTable.querySelectorAll('#items nuxeo-data-table-row');
	if (this.dataRows) {
		for (var i = 0; i < this.dataRows.length; i++) {
			this.setColorOnRow(valueOccurrence, this.dataRows[i]);
		}
	}
},
  
//The function to change the color
setColorOnRow: function(occurrence, row) {
	//Here i add a random class color ;
	var rowColor;
	row.classList.add(rowColor);
},

Thank you for your help,

Best regards,

Charly CARRERE

Re: Custom Row Color in the nuxeo-data-table

__9 — Mon, 05 Dec 2016 10:50:31 GMT

I Find a solution, I add a setTimeout to update the color row for the next js cycle :

updateOccurrenceColor: function() {
    var self = this;
    setTimeout(function() {
	    self.dataRows = self.$.dataModuleTable.querySelectorAll('#items nuxeo-data-table-row');
	    if (self.dataRows) {
	        for (var i = 0; i < self.dataRows.length; i++) {
	            self.setColorOnRow(valueOccurrence, self.dataRows[i]);
	        }
	    }
    });
},

topic Custom Row Color in the nuxeo-data-table in Nuxeo Forum

Custom Row Color in the nuxeo-data-table

Re: Custom Row Color in the nuxeo-data-table