Unanswered

Power apps, Model driven app

(0) Share

Report

Posted on by FarazAli

Hi All, this is probably my first question here. I want to add background colors in my subgrid (Editable Grid View), I want to add different colors for the different columns, I am using the web resource as JS file, here is my code.

{
function formatColumn(rowData, userLCID) {
debugger;
var style = '<style> ';
style += '.wj-cells .wj-row div:nth-child(4) { background: red !important;}';
style += '.wj-cells .wj-row div:nth-child(5) { background: yellow !important;}';
style += '</style>'
document.body.innerHTML += style

}

It will not change when i publish my app. This script works when I run it on console. Please find me the method to do this, thanks

Categories:

Building Power Apps

All responses (5)

Answers (0)

Sort by

AhmedSalih

6,680 Moderator on at

Like (0)

Report

Copy link

Link copied!

Hello, @FarazAli, You need to assign the web resource you created to your View's Columns .

Go to your View and Edit, then Click Switch to Classic> Select the Column and select the web resource & the Function name. Lastly, Save and Publish the View after saving the Columns settings in the classis settings:

If my reply helped you, please give a 👍, & if it solved your issue, please 👍 & Accept it as the Solution to help other community members find it more.

I am primarily available on weekdays from 6-10 PM CT and 5-10 PM CT on weekends.

Visit my Blog: www.powerplatformplace.com

FarazAli 10 on at

Like
a
(0)

Report
Copy link

Link copied!

Spoiler (Highlight to read)
I did the same as you mentioned. Nothing happened.
I did the same as you mentioned. Nothing happened.
FarazAli 10 on at

Like
a
(0)

Report
Copy link

Link copied!

@AhmedSalih is there any other option to apply css using web resource to a column?

AhmedSalih

6,680 Moderator on at

Like (0)

Report

Copy link

Link copied!

Hello, @FarazAli, not to many resources about the css but this video will give you some direction.

https://www.youtube.com/watch?v=2OdqFHfl0Io

If my reply helped you, please give a 👍, & if it solved your issue, please 👍 & Accept it as the Solution to help other community members find it more.

I am primarily available on weekdays from 6-10 PM CT and 5-10 PM CT on weekends.

Visit my Blog: www.powerplatformplace.com

FarazAli 10 on at

Like
a
(0)

Report
Copy link

Link copied!

@AhmedSalih thanks for your response, I think I asked my question in some tricky way, this is my scenario please have a look, this is my view
I go to customize view, then in the first column I added web recourse and function name as well.
this is my webresource js code
function formatColumn(rowData, userLCID) {
debugger;
var style = '<style> ';
style += '.wj-cells .wj-row div:nth-child(4) { background: red !important;}';
style += '.wj-cells .wj-row div:nth-child(5) { background: yellow !important;}';
style += '</style>'
document.body.innerHTML += style
}
when published the app, the code wont work.