0

I'm using the script editor to format my list. When I use this block of code:

function boldTemplate(ctx){
    var value = ctx.CurrentItem[ctx.CurrentFieldSchema.Name];
    switch(value){
        case "":
            return"<span style='background-color:yellow'>"+"testing"+"</span>";
            break;
    }
}

This will highlight the text "testing" instead of making the whole cell yellow.

If my switch case looked like this:

switch(value){
    case "":
        return"<span style='background-color:yellow'>"+"</span>";
        break;
}

No colour would be displayed at all.

Is there a way to colour the cells?

1

Span is an in-line element. Change it to a div or update the style of the span to display as block. Ex:

<span style=‘display:block;width:100%;background-color:yellow’>
  • Is there a way to make the height 100% too? I tried to add height:100% but it didn't change anything. – Jummi Sep 27 '18 at 14:22
  • it seems like adding height:50px works, but I don't want the height to be a fixed size – Jummi Sep 27 '18 at 15:21
1

It's a normal behavior, you are trying the pass the style to the content of SPAN and when the SPAN is empty it doesn't show anything!

So try to use &nbsp;&nbsp;&nbsp;&nbsp; for the empty SPAN! or use DIV instead with block style!

If you need to fill the list item cell itself, so try the JSLink examples at

  • In the examples you linked, it shows that the cell is colored from end to end but not top to bottom. Is there a way to accomplish this too? – Jummi Sep 27 '18 at 15:19

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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