Alternating row style and pring

[Christopher Holubarz]

Hi Alex,

I want to print rows from the vLookup Table in alternating style. It works to show the rows in alternating style with jQuery in the form itself, but when I want to print the tab, the style is not printed out with.

Do you have a suggestion on how to set the css for the vLookup to alternating by default ? Maybe the dynamic setting with jQuery is the problem here.

Thank you very much in advance,
BR,
Chris

[Alexander Bautz]

Hi,
You should be able to color alternating rows by adding this to the Custom CSS:

.vLookupTableRow:nth-child(even){
    background-color:#eaeaea;
}

I’m working on an improved print functionality for the tabs so you might want to take a look at it and combine it with the above CSS snippet: https://spjsblog.com/forums/topic/page-breaks-when-printing-form/#post-23315

Please note that its only tested in Google Chrome and I’m working on getting it running in other browsers.

Alexander

[Phil Grant]

Just to let you know that with IE and sharepoint 2010 this CSS doesn’t seem to work for me.

I’m not looking at printing though, I just want alternate colours in the display form.

Regards,
Phil

• This reply was modified 5 years, 3 months ago by Phil Grant.

[Alexander Bautz]

The :nth-child selector does not work in IE 8 (SP 2010 forces IE11 into IE8 mode). You can add this to your Custom JS to fix it (change vLookupTasks to match your vLookup column InternalName):

function vLookupIsLoadedCallback(fin){
    if(fin === "vLookupTasks"){
    	jQuery(".vLookupTableRow:even").css("background-color","#eaeaea");
    }
}

Alexander

[Phil Grant]

Thanks it worked a treat.

We were supposed to got to Sharepoint 2016 last August but it keeps getting delayed, hopefully now next month ….. I won’t hold my breath.

Cheers,
Phil

[Christopher Holubarz]

Hi Alexander,

Thank you very much, that worked like a charm.

BR,
Chris

[Author]

Posts