Applying PrimeFaces theme only for one JSF page - jsf-2

We should apply primefaces theme for a jsf page
<context-param>
<param-name>primefaces.THEME</param-name>
<param-value>bluesky</param-value>
</context-param>
I want to apply for one page this primefaces theme.How to do this?

If you add it as a context-param, it will be used for all pages. This is what you need to do:
1 - Get the jar of the bluesky theme and extract it to a folder. We'll use these files later.
2 - In the 'resources' folder create a subfolder called "primefaces-bluesky".
3 - In this folder, copy the file theme.css from the theme and also the 'images' folder.
4 - In the page in which you want to use the theme, include the stylesheet <h:outputStylesheet library="primefaces-bluesky" name="theme.css" />

Related

Is it necessary to declare tags in facelet taglib 2.0?

I've read the tutorial: http://jsflive.wordpress.com/2011/03/24/custom-component-library/ in which the authors are making empty .taglib.xml file, and according to tutorial the tags should be automatically loaded from the resource subfolder.
However, by me I have exception:
javax.faces.FacesException: Could not get component metadata for
myComponent.xhtml
I have to manually specify each tag:
<tag>
<tag-name>myComponent</tag-name>
<source>tags/mylib/myComponent.xhtml</source>
</tag>
Am I missing something? Where the tag definition locations would be automatically resolved? I'm running on WebSphere 7.0 and MyFaces 2.0.7.
I think you mix things up here. In my above mentioned blog post I added composite components to the tag lib like this:
<facelet-taglib>
<namespace>http://jsflive.at/taglib</namespace>
<composite-library-name>jsflive</composite-library-name>
</facelet-taglib>
This adds all composite components of the resource library with the name specified in composite-library-name. The tag names are derived from the file names by convention.
You on the contrary specify a tag for a Facelets fragment:
<tag>
<tag-name>myComponent</tag-name>
<source>tags/mylib/myComponent.xhtml</source>
</tag>
This has nothing to do with composite components! This approach is the pre JSF 2.0 way of defining custom tags for Facelets fragments. Your code creates a tag for the referenced xhtml file, which could be an arbitrary Facelets file. The path is relative to the location of the taglib.xml file in this case.
JSF 2.2 however will provide a way to specify tags for specific composite components. My post http://jsflive.wordpress.com/2013/04/06/jsf22-cc-taglib/ shows how this works.

Not able to apply custom css applied for rich:dataTable header class

I am working on sample project of JSF 2.0 with richfaces 4.Probelm is richfaces skin are not applied to the components.
i want to use custom css for HeaderClass of Richdatatable but i am not able to show that. only inbuilt css are applied to headers. even for columnClasses also if i used only single value like this : columnClasses="JspContentForDataTable , its not showing i have to do columnClasses="JspContentForDataTable,JspContentForDataTable,JspContentForDataTable,JspContentForDataTable" for each column.
web.xml :
<context-param>
<param-name>org.richfaces.skin</param-name>
<param-value>ruby</param-value>
</context-param>
<context-param>
<param-name>org.ajax4jsf.VIEW_HANDLERS</param-name>
<param-value>com.sun.facelets.FaceletViewHandler</param-value>
</context-param>
<context-param>
<param-name>org.richfaces.CONTROL_SKINNING</param-name>
<param-value>disable</param-value>
</context-param>
<context-param>
<param-name>org.richfaces.LoadStyleStrategy</param-name>
<param-value>None</param-value>
</context-param>
<context-param>
<param-name>org.jboss.jbossfaces.WAR_BUNDLES_JSF_IMPL</param-name>
<param-value>true</param-value>
</context-param>
Please correct if i am doing anything wrong.
Help me out thanks in advanced.
The main reason why your styles are not getting applied to the element/component is that the style sheets are loaded earlier and then over-written by the default styles, to include the styles at run-time you have to import your style-sheets using tag
Eg:-
<h:outputStylesheet library="css" name="style.css" />
Remember to include the declaration in the <h:head> tag of your page.
For more detailed descriptions on loading a css at run-time using refer this link
Including css using h:outputStyleet
Okay I think I found your fix try this, there seems to be some problem while applying the css to your custom datatable.
Include this statement in your base file or current page.
For any custom component you add include the basic rich tag you include in that component that's causing you some issue as an non rendered component and it would work out just fine.
Eg:- For your current custom tag the basic rich component you might be using is an rich:dataTable right so add this component with a rendered="false" in your file where you use the component.
Like <rich:dataTable rendered="false"/> this would fix your issue fingers crossed not certain about why this happens but this should fix the issue.

Cannot import the CSS in JSF pages

I'm learning to use ADF on Oracle jDeveloper 11g.
I created an ADF Fusion Web Application (with the WebLogic webserver) and I created a JSF page under \ViewController\public_html. Then I created a CSS skin file (for JSF) and I put it under \ViewController\WebContent\resources\css\
I want to apply such style rules to the JSF page. To do this I put it into such page the line
<h:outputStylesheet library="css" name="prova.css" id="CASD"/>
where prova.css is the name of the CSS file I've created.
It doesn't work, neither using /css instead of css or /resources/css, etc.
Try using <af:resource type="css" source="your source path here" /> instead.
You shoud make a skin and add your page. When you make a skin
the name of skin is set in trinidad-config.xml in your project:
<skin-family>skin2(name of skin)</skin-family>

Welcome page in JSF

How can I use a JSF page as welcome file? The FacesServlet is mapped on *.jsf and the <welcome-file> is set to index.xhtml. However, it does not show the JSF components. I tried to set the <welcome-file> to index.jsf, but this results in a HTTP 404 error.
I'm using Tomcat 6.0 and JSF 2.1.
Just rename <welcome-file> entry of index.xhtml to index.jsf and create an empty index.jsf file next to index.xhtml to fool the container that the file actually exist.
Alternatively, you can also just get rid of the .jsf extension altogether and use .xhtml all the way. This can be done by changing <url-pattern> of FacesServlet from *.jsf to *.xhtml.
Adding it to your welcome-file-list like this:
<welcome-file-list>
<welcome-file>index.jsf</welcome-file>
</welcome-file-list>
Does work, but you'll need Tomcat 7.
Another approach which also works with Tomcat 6 is adding a file called index.jsp with the following contents:
<jsp:forward page="/index.jsf"/>

Struts 2 + Dojo + Datetimepicker

One quick question.
How can I use the "simple theme" () and "dojo datetimepicker" () together?
I have read that if you only want to use the simple theme, then manually import all the required dojo files using the code in head.ftl...
The thing is all those js are in struts dojo jar file which is included in the class path. How can I include them in the jsp? What should be the whole path? Any example will be helpful.
Performance Tuning
1. Enable Freemarker template caching
In Struts versions prior to 2.0.10,
you had to copy the /template
directory from the Struts 2 jar in
your WEB_APP root to utilize
Freemarker's built in chaching
mechanism in order to achieve similar
results.
The built in Freemarker caching
mechanism fails to properly cache
templates when they are retrieved from
the classpath. Copying them to the
WEB_APP root allows Freemarker to
cache them correctly. Freemarker looks
at the last modified time of the
template to determine if it needs to
reload the templates. Resources
retrieved from the classpath have no
last modified time, so Freemarker will
reload them on every request.
2. When overriding a theme, copy all necessary templates to the theme
directory.
There's a performance cost when a
template cannot be found in the
current directory. The reason for this
is that Struts 2 must check for a
template in the current theme first
before falling back to the parent
theme. In the future, this penalty
could be eliminated by implementing a
missing template cache in Struts 2.
Example
YourWebApp
|-- WebContent
|-- templates
|-- ajax
|-- controlheader.ftl, datetimepicker.ftl, dojoRequire.js, head.ftl
|-- simple
|-- [All files]
|-- xhtml
|-- controlfooter.ftl, controlheader-core.ftl, controlheader.ftl, tooltip.ftl, validation.js
<struts>
<constant name="struts.ui.templateDir" value="templates" />
<constant name="struts.ui.theme" value="simple" />
</struts>
<%# taglib prefix="sx" uri="/struts-dojo-tags" %>
<head>
<sx:head />
</head>
<body>
<sx:datetimepicker name="date" />
</body>
The Datetimepicker of Ajax Tags is bad, did you consider jQuery UI Timepicker/Datetimepicker?

Resources