I am currently working on a customer application which is oneuiv2.1 themed and I wanted to create a simple jQuery Mobile site. the dojo css was really messing up the styling and just for interest I wanted to see if I could programmatically remove the dojo css from the page client side
The application has the property checked to use runtime optimized JavaScript and CSS. This combines all the dojo css files nicely into one link.
Using a jQuery selector I can get a handle on that <LINK> as follows
$('link[href*="dojo.css"]') //select all LINK objects where the href contains dojo.css
Once I have that I can just remove the element from the DOM like this
$('link[href*="dojo.css"]').remove()
Unfortunately I cannot show you what this does my customer’s site to make it look all pretty and jQueryMobile like, but I can show you how it blows up a oneui site and you can take it from me this fixed my problem.
Just add the above code in a *SCRIPT* tag within your XPage and it will remove the dojo style before it is rendered to the end user – thus they will never know.
http://xpages.info/xpageshome.nsf/Demos.xsp
Before
After
Caveat
Yeah I realize this means the CSS file(s) are downloaded and then removed and I am sure there are more elegant ways to handle the issue server-side.
This was an exercise in learning that jQuery can be used to remove entire CSS DOM objects š
Mark, or just use a theme that extends webstandard instead of oneui š
Per – thanks for the comment š
To use jQueryMobile I need to remove webstandard from the theme. From what I googled though there is no good way to switch a theme dynamically per page. Unless you know otherwise.
The current site does not have a theme element it just uses oneuiv2.1 in the XSP properties
so for one page I need to replace the theme
context.setSessionProperty(“xsp.theme”, themeName). works but not the first time you access the page – it must be too far down the JSF tree – even when placed in the beforerenderresponse event – no joy š¦
http://stackoverflow.com/questions/9367722/how-to-use-multiple-themes-at-the-same-time
So for one page I will just kill the dojo for the moment. It works and as I said above – this was educational more than anything.
Regarding this issue I used a different approach after some help from SO: http://mardou.dyndns.org/Privat/osnippets.nsf/snippet.xsp?documentId=849EA933C7B248D6C1257B9A0039938E
Adapt it not to check the release but the page(s) name(s) here – should work fine.
Thanks Oliver – nice work around although I wish it were unnecessary – thanks š
Reblogged this on Sutoprise Avenue, A SutoCom Source.
This is something that I have been trying to research and have not found a resolution. Is there anyway of preventing the xpages theme from loading if you are using the standard dojo setup?
Hi Mark – did you try the ‘use mobile theme fox xPages with prefix’ setting? That should let you switch the theme for any mobile xpages – and as a plus you could add all the jquery mobile css / js in there as well.
this article and its comments are very useful for my case. thanks you very much