Discussions
Categories
Groups
Community Home
Categories
INTERNAL ENABLEMENT
POPULAR
THRUST SERVICES & TOOLS
CLOUD EDITIONS
Quick Links
MY LINKS
HELPFUL TIPS
Back to website
Home
Intelligence (Analytics)
Using External CSS File with hierarchies and unsupported style types
Tubal
Hi there.
I'm trying to implement some javascript functionality inside of some html text elements. (Date Pickers to be specific)
Most of them need to use css styles that are unsupported in BIRT, such as rounded corners, outlines, etc.
Is is possible to use these unsupported styles?
Also, related, some of the css files I use have hierarchical classes, and BIRT doesn't like that either. I assume this isn't supported?
Find more posts tagged with
Comments
kclark
Is the JS date picker working so far without the CSS?
Tubal
It is functioning correctly, yes. But the CSS formatting isn't loading because it's not supported, so it's not really useable.<br />
<br />
This is what it looks like without the formatting:<br />
<br />
kclark
There is a possible way around this. If you go to where you installed the runtime, find webcontent/birt/styles/style.css and you can add your code here. webcontent/birt/pages/layout/runfragment.jsp and framesetfragment.jsp call this style so it'll be inherited when you view the report in the web viewer. Let me know if this works for you.
Tubal
Thanks for the help. I'll give it a shot.
johnw
The problem is that BIRT will generate its own HTML output, so it won't include any of your CSS files on generation. There are a couple of ways to fix this. There are some external JS libraries that you can use that will modify the head statement at runtime. We have used this with a lot of success. It should be able to add CSS includes as well. There is a plugin I created that is in the devShare that is a modified HTML emitter that will allow you to add in any statement to the head section of the HTML at render time server side that will work also. I have used this for a lot of things, including client side CSS includes.
Tubal
Thanks for the tip John. I was able to get it working using your plugin.
Most of our live reports are run inside the Birt Viewer (i.e. they start with the "
http://x.x.x.x/birt/frameset?__....."
;
That frameset gives the user different export options, etc.
But I assume that frameset creates it's own <HEAD> tags, and the ones I add with your plugin then aren't read?
So would my only option be to modify the framesetfragment.jsp file to include the .css styles as kclark has suggested?
I'd rather stay away from that option, because I don't have direct access to our webserver, and would have to put in a request for change and have someone change those files on the runtime each time I needed a design change. I'd like to as much in the report file as I can.
Thanks,
Phil
willy27
<blockquote class="ipsBlockquote" data-author="johnw" data-cid="111703" data-time="1353458582"><div><p>The problem is that BIRT will generate its own HTML output, so it won't include any of your CSS files on generation. There are a couple of ways to fix this. There are some external JS libraries that you can use that will modify the head statement at runtime. We have used this with a lot of success. It should be able to add CSS includes as well. There is a plugin I created that is in the devShare that is a modified HTML emitter that will allow you to add in any statement to the head section of the HTML at render time server side that will work also. I have used this for a lot of things, including client side CSS includes.</p></div></blockquote><p>Hi john,</p><p>I've just started with Birt last week, and I'm currently facing with a trouble which seems to be not so simple: I want to (PDF) edit some text</p><p>that I retrieve under html form, and containing <p> tag embedded : I would like to remove the vertical space associated with the <p>, as I would do with a " <em>p {margin-top: 0;}" </em>css file, but importing and using this css file does not fix the issue: do you see another solution I could try in order to modify the <p> attributes ?</p><p>Thanks in advance,</p><p>****</p>