I am new to CSR trying to code entire Sharepoint List row based on the status, but the code is returning null as shown below:
for (var i=0;i<rows.length;i++)
{
var status = rows[i].Request_x0020_Status;
var rowId = GenerateIIDForListItem(ctx, rows[i]);//return rowID as (0,421,0)
var row = document.getElementById(rowId);//returns null
if(status=="Rechazado")
{}
//row.style.backgroundColor = "#b1b1b1";
}
Use this JSLink code to color entire row based on Request Status column:
<script type="text/javascript">
(function() {
var overrideCurrentContext = {};
overrideCurrentContext.Templates = {};
overrideCurrentContext.OnPostRender = HighlightProductRows;
SPClientTemplates.TemplateManager.RegisterTemplateOverrides(overrideCurrentContext);
})();
function HighlightProductRows(ctx) {
var statusColors = {
'Rechazado': '#b1b1b1',
'Pending': '#FFD800',
'Completed': '#01DF3A'
};
var rows = ctx.ListData.Row;
for (var i = 0; i < rows.length; i++) {
console.log(rows[i]);
var status = rows[i]["Request_x0020_Status"];
var rowId = GenerateIIDForListItem(ctx, rows[i]);
console.log(rowId);
var row = document.getElementById(rowId);
row.style.backgroundColor = statusColors[status];
}
}
</script>
This is the render result and Developer Console data for rowId and row: