Text Alignment for Cell

Webix JS
1

Is it possible to customize text alignment for headers and cells, ie get headers centered and cells right aligned?

2

Yes, it is possible via onHeaderInit event (available since 3.0 version):

view: "pivot",
on:{
   onHeaderInit: function(columns){
	for(var i=0; i< columns.length;i++){
		columns[i].css = {"text-align": "right"};
		var header = columns[i]["header"];
		for(var j = 0; j < header.length; j++){
 	 	   header[j].css = {"text-align": "center"};
		}
	}
    }
}
3

Maria

Thanks again.
You’re my lifesaver

4

What about setting the width for columns? Is it possible to change the (default?) 150px width?

5

It is possible to change the width of [2nd,…,n-th] columns via columnWidth property:

view: "pivot",
columnWidth: 180,
...
6

Thanks.
One last question before purchasing the component: is it possible to set custom colors for cell’s content according to its value (say, for example, I want to set the text color to green for values > 0, red for values < 0, and use the default color when value is 0)?

7

Yes, it is possible via cssFormat property of DataTable columns:

onHeaderInit: function(columns){
	for(var i=0; i< columns.length;i++){
		columns[i].cssFormat = function(value){
			var css = "";
			if(value <0)
				css = { "color":"red" };
			else if(value >0 )
				css = { "color":"green" };
			return css;
		};
	}
}