-1

I need to give backgrounds to columns and change font styling of table in UI5 using javascript and css. I need to know how do I reach a particular element if CSS has to be applied to it. How do it I do that?

1
  • give table a class by addclass() method and do whatever you want as usual in css
    – Roshan
    Jul 25, 2014 at 11:57

2 Answers 2

1

add class on your table or column whereever you want as

oTable.addStyleClass("classname");

use css as usual

.classname{
color:red
}

and include this css file in index.html

Based on your comment: to add id to table header column use it in this way

var oColumn = new sap.ui.table.Column("tc",{
    label: new sap.ui.commons.Label({text: "Last Name"}),
    template: new sap.ui.commons.TextView().bindProperty("text", "lastName"),
    sortProperty: "lastName",
    filterProperty: "lastName",
    width: "200px"
});

Here id=tc is added to this header.

write css as you need

#tc{
color:red
}

SEE DEMO HERE

3
  • Thanks for your help Roshan... what I really wanted to do was give the rows in the table alterbate colors using nth child in css... how do i give the rows a class / target rows in the oTable for specific CSS... Jul 28, 2014 at 7:04
  • Thanks buddy... gr8 help.. but how to style the header i.e. column heading...tr and td work fine... th is not working... how do i do that? Jul 28, 2014 at 7:54
  • if the solution solved your query you can accept the answer(by selecting the green tick mark), or else if you have something else you can ask that too. :)
    – Roshan
    Jul 28, 2014 at 8:41
0

==================xml===================================

===================format js===========================

yaoji.utils.formatter.format = function (cellValue) {
     this.onAfterRendering= function() {
     //!!! if not after redering, can't get the dom
        var cellId = this.getId(); 
        $("#"+cellId).parent().parent().parent().css("background-color","red"); 
     return cellValue;
};  

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.