I am trying to display the grid table in my application. I would like to color the table cells based on condition.
Am using XML views in my application.
Here is the index.html page code.
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta http-equiv='Content-Type' content='text/html;charset=UTF-8'/>
<script src="resources/sap-ui-core.js"
id="sap-ui-bootstrap"
data-sap-ui-libs="sap.m"
data-sap-ui-theme="sap_bluecrystal"
data-sap-ui-xx-bindingSyntax="complex"
data-sap-ui-resourceroots='{"test23": "./test23"}'>
</script>
<style type="text/css">
.green {
background-color: #66FF33;
}
.red {
background-color: #FF3300;
}
.yellow {
background-color: #FFFF66;
}
</style>
<script>
sap.ui.getCore().attachInit(function() {
new sap.m.App ({
pages: [
new sap.m.Page({
showHeader : false,
showFooter : false,
content: [ new sap.ui.core.ComponentContainer({
name : "zppprodschedule"
})]
})
]
}).placeAt("content");
});
</script>
</head>
<body class="sapUiBody" role="application">
<div id="content"></div>
</body>
</html>
//============================================
view.xml (specific Column in the table)
<Column width="4rem">
<m:Label text="Status" />
<template>
<m:Label text="{path:'Status', formatter:'.colorFormatter'}" />
</template>
</Column>
//===============================================
controller.js
colorFormatter: function(value) {
if (value == "") {
value = this.addStyleClass("yellow");
}else{
value = this.addStyleClass("green");
}
return value;
}
Error: Uncaught TypeError: Cannot read property 'addStyleClass' of undefined
Thanks,
PoornChand M