Hi Roddy,
what kind of "Table View" are you using in NG ?
I recommend using the Data Grid component which is the most feature complete.
Is possible to use HTML snippet in grid, however inline style will be sanitized.
If you trust the data you can avoid data sanitizing by using putClientProperty(APP_UI_PROPERTY.TRUST_DATA_AS_HTML, true);
Changing CSS class at runtime is also possible. There is an example of it in the Servoy Sample Solution.
Using application.overrideStyle(lessfile, lessfile2).
You can make use of LESS variables for the colors to be used in your CSS. You can then override these values at runtime.
From the sample solution code:
The .less file to be overriden looks like this:
- Code: Select all
@import 'cloudSampleSolution.less';
// Add your custom less/css to this file you can use the same less properties that are specified in the above properties.less
@main-color: %%MAIN-COLOR%%;
@sidenav-color: %%SECONDARY-COLOR%%;
Can be easily overriden in code
- Code: Select all
function overrideStyleColors(mainColor, secondaryColor) {
var newColorStyle = {
'MAIN-COLOR': mainColor,
'SECONDARY-COLOR': secondaryColor
}
// set the preferred colors
var mediaOriginal = solutionModel.getMedia('cloudSampleTemplateOriginal.less');
var cssText = mediaOriginal.getAsString();
// override css
cssText = utils.stringReplaceTags(cssText, newColorStyle);
var media = solutionModel.getMedia('cloudSampleTemplate.less');
media.setAsString(cssText);
application.overrideStyle('cloudSampleSolution.less', 'cloudSampleTemplate.less');
}
Regards,
Paolo