nav[aria-label="Primary Navigation"] { padding: 0; & ul { list-style: none; width: 100%; display: flex; flex-direction: row; justify-content: start; align-items: start; gap: 30px; padding: 0; & li { margin: 0; } & ul li { list-style: none; } } }

Dynamically Change Style using javascript

MarkW

I have a Text component (set as HTML) with ID=X within a table cell. I have created a new style called MyStyle1 and applied that style to the Text component.

I also have created two other styles called MyStyle2 and MyStyle3 that would show a different background.
Using javascript, how can I change the style from MyStyle1 to MyStyle2 after the report is run?
I tried getElementById('X').className='MyStyle2' but it does not work.

When I first check to see what className is being used using alert(getElementById('X').className), it comes back with something like style_18. Where is it getting that ID?? I would have expected it to say 'MyStyle1';

Find more posts tagged with

Comments

johnw

If you are trying to do it client side using Javascript, you need to set a Bookmark, that will set the appropriate HTML id to whatever the Bookmark expression evaluates to.

Why are you trying to do it after the report runs? Why not set the style using a Highlight during the report execution?

MarkW

I am using BIRT for a dashboard. After dashboard loads , I use AJAX to periodically get status updates from backend.

Depending on those status values, I want to change the style of certain areas of the dashboard.

MarkW

<blockquote class='ipsBlockquote' data-author="'MarkW'" data-cid="107358" data-time="1342748015" data-date="19 July 2012 - 06:33 PM">
I am using BIRT for a dashboard. After dashboard loads , I use AJAX to periodically get status updates from backend. 
 
Depending on those status values, I want to change the style of certain areas of the dashboard. 
 
I did set the bookmark. The problem is, how to I get a handle of the style that I imported. 
 
Example: 
 
I imported style css that contained the following: 
 
.OUTAGE{ 
. 
. 
} 
 
How do I set a certain area on the dashboard using the bookmark to have the class='OUTAGE'. 
Normally, I would use document.getElementById(ID).className='OUTAGE'; But this did not work. 
It is as if it could not find class OUTAGE. </blockquote>