-
1. ExtendedDataTable doesn't respect skin?
boy18nj Mar 3, 2011 5:27 PM (in response to ibstmt)show your code please
-
2. ExtendedDataTable doesn't respect skin?
ilya40umov Mar 4, 2011 5:19 AM (in response to boy18nj)Make sure that CSS is not simply cached in your browser.
-
3. Re: ExtendedDataTable doesn't respect skin?
ibstmt Mar 4, 2011 8:06 AM (in response to ibstmt)Clearing the cache did not help. Here are my web.xml, template.xhtml, and main page. On any page, the skin shows up fine in menu and dataTables, but not on ExtendedDataTable.
web.xml:
<?xml version="1.0" encoding="UTF-8"?>
<web-app version="2.5" xmlns="http://java.sun.com/xml/ns/javaee"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd">
<display-name>Sales</display-name>
<description>Manage Sales</description>
<!-- Richfaces -->
<!-- if using with Trinidad, disable a4j view handler and
add a4j-trinidad.jar into lib -->
<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.SKIN</param-name>
<param-value>classic</param-value>
</context-param>
<!-- Seam -->
<listener>
<listener-class>org.jboss.seam.servlet.SeamListener</listener-class>
</listener>
<servlet>
<servlet-name>Seam Resource Servlet</servlet-name>
<servlet-class>org.jboss.seam.servlet.SeamResourceServlet</servlet-class>
</servlet>
<servlet-mapping>
<servlet-name>Seam Resource Servlet</servlet-name>
<url-pattern>/seam/resource/*</url-pattern>
</servlet-mapping>
<filter>
<filter-name>CAS Filter</filter-name>
<filter-class>edu.yale.its.tp.cas.client.filter.CASFilter</filter-class>
<init-param>
<param-name>edu.yale.its.tp.cas.client.filter.loginUrl</param-name>
<param-value>https://issvmj2ee.ibi.com/cas/login</param-value>
</init-param>
<init-param>
<param-name>edu.yale.its.tp.cas.client.filter.validateUrl</param-name>
<param-value>https://issvmj2ee.ibi.com/cas/serviceValidate</param-value>
</init-param>
<init-param>
<param-name>edu.yale.its.tp.cas.client.filter.serverName</param-name>
<param-value>auto/issvm.*:80/default:8081</param-value>
</init-param>
</filter>
<filter-mapping>
<filter-name>CAS Filter</filter-name>
<url-pattern>/</url-pattern>
<url-pattern>/index.jsp</url-pattern>
<url-pattern>/quoteQ.seam</url-pattern>
<url-pattern>/quote.seam</url-pattern>
</filter-mapping>
<filter>
<filter-name>Seam Filter</filter-name>
<filter-class>org.jboss.seam.servlet.SeamFilter</filter-class>
</filter>
<filter-mapping>
<filter-name>Seam Filter</filter-name>
<url-pattern>/*</url-pattern>
</filter-mapping>
<!-- facelets -->
<context-param>
<param-name>facelets.DEVELOPMENT</param-name>
<param-value>true</param-value>
</context-param>
<!-- JSF -->
<context-param>
<param-name>javax.faces.DEFAULT_SUFFIX</param-name>
<param-value>.xhtml</param-value>
</context-param>
<context-param>
<param-name>javax.faces.STATE_SAVING_METHOD</param-name>
<param-value>server</param-value>
</context-param>
<servlet>
<servlet-name>Faces Servlet</servlet-name>
<servlet-class>javax.faces.webapp.FacesServlet</servlet-class>
<load-on-startup>1</load-on-startup>
</servlet>
<servlet-mapping>
<servlet-name>Faces Servlet</servlet-name>
<url-pattern>*.seam</url-pattern>
</servlet-mapping>
<!-- session duration...in minutes -->
<session-config>
<session-timeout>15</session-timeout>
</session-config>
<security-constraint>
<display-name>Restrict raw XHTML Documents</display-name>
<web-resource-collection>
<web-resource-name>XHTML</web-resource-name>
<url-pattern>*.xhtml</url-pattern>
</web-resource-collection>
<auth-constraint>
<role-name>NONE</role-name>
</auth-constraint>
</security-constraint>
<welcome-file-list>
<welcome-file>index.jsp</welcome-file>
</welcome-file-list>
<ejb-ref>
<ejb-ref-name>ejb/Authentication</ejb-ref-name>
<ejb-ref-type>Session</ejb-ref-type>
<remote>com.ibi.ejb.authentication.Authentication</remote>
</ejb-ref>
<ejb-local-ref>
<ejb-ref-name>sales/GlobalVarBean/local</ejb-ref-name>
<ejb-ref-type>Session</ejb-ref-type>
<local>com.ibi.ejb.view.stateless.GlobalVar</local>
<ejb-link>GlobalVarBean</ejb-link>
</ejb-local-ref>
<ejb-local-ref>
<ejb-ref-name>sales/OutboundSsoBean/local
</ejb-ref-name>
<ejb-ref-type>Session</ejb-ref-type>
<local>com.ibi.ejb.web.OutboundSso</local>
<ejb-link>OutboundSsoBean</ejb-link>
</ejb-local-ref>
<ejb-local-ref>
<ejb-ref-name>sales/OrderManagerBean/local</ejb-ref-name>
<ejb-ref-type>Session</ejb-ref-type>
<local>com.ibi.ejb.order.OrderManager</local>
<ejb-link>OrderManagerBean</ejb-link>
</ejb-local-ref>
<ejb-local-ref>
<ejb-ref-name>sales/SalesManagerBean/local</ejb-ref-name>
<ejb-ref-type>Session</ejb-ref-type>
<local>com.ibi.ejb.view.stateful.SalesManager</local>
<ejb-link>SalesManagerBean</ejb-link>
</ejb-local-ref>
<ejb-local-ref>
<ejb-ref-name>sales/SiteManagerBean/local</ejb-ref-name>
<ejb-ref-type>Session</ejb-ref-type>
<local>com.ibi.ejb.site.SiteManager</local>
<ejb-link>SiteManagerBean</ejb-link>
</ejb-local-ref>
<ejb-local-ref>
<ejb-ref-name>sales/DomainManagerBean/local</ejb-ref-name>
<ejb-ref-type>Session</ejb-ref-type>
<local>com.ibi.ejb.domain.DomainManager</local>
<ejb-link>DomainManagerBean</ejb-link>
</ejb-local-ref>
<ejb-local-ref>
<ejb-ref-name>sales/PricingManagerBean/local</ejb-ref-name>
<ejb-ref-type>Session</ejb-ref-type>
<local>com.ibi.ejb.price.PricingManager</local>
<ejb-link>PricingManagerBean</ejb-link>
</ejb-local-ref>
<ejb-local-ref>
<ejb-ref-name>sales/EjbSynchronizations/local</ejb-ref-name>
<ejb-ref-type>Session</ejb-ref-type>
<local>
org.jboss.seam.transaction.LocalEjbSynchronizations
</local>
<ejb-link>EjbSynchronizations</ejb-link>
</ejb-local-ref>
</web-app>
template.xhtml
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:s="http://jboss.com/products/seam/taglib"
xmlns:a4j="http://richfaces.org/a4j"
xmlns:rich="http://richfaces.org/rich">
<head>
<title>#{title}</title>
<link rel="stylesheet" type="text/css" href="css/common.css" />
<link rel="stylesheet" type="text/css" href="css/style.css" />
</head>
<body>
<h:form>
<div style="min-width=810px">
<img src="./images/coresprite.gif" />
<ui:insert name="logoutButton">
<h:panelGrid cellpadding="0" cellspacing="0" columns="2"
style="width:80px;vertical-align:middle;float:right;"
rendered="#{empty callerUrl}">
<s:link action="#{identity.logout}">
<h:graphicImage style="border:0px;" value="./images/kdeicons/exit.png" />
</s:link>
<s:link styleClass="regularlink" action="#{identity.logout}"
value="Close" />
</h:panelGrid>
<h:panelGrid cellpadding="0" cellspacing="0" columns="2"
style="width:80px;vertical-align:middle;float:right;"
rendered="#{not empty callerUrl}">
<s:link action="#{applicationManager.jumpToCallerWithoutResult}">
<h:graphicImage style="border:0px;" value="./images/kdeicons/exit.png" />
</s:link>
<s:link styleClass="regularlink" action="#{applicationManager.jumpToCallerWithoutResult}"
value="Cancel" />
</h:panelGrid>
</ui:insert>
</div>
<div>
<ui:insert name="mainmenu">
<rich:toolBar >
<ui:insert name="additionalMenus" />
</rich:toolBar>
</ui:insert>
</div>
<div class="mainbodyContainer">
<ui:insert name="mainbody">content</ui:insert>
</div>
</h:form>
<div class="modalPanels">
<ui:insert name="modalpanels">content</ui:insert>
</div>
</body>
</html>
mypage.xhtml
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition
xmlns="http://www.w3.org/1999/xhtml"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:s="http://jboss.com/products/seam/taglib"
xmlns:a4j="http://richfaces.org/a4j"
xmlns:rich="http://richfaces.org/rich"
template="template.xhtml">
<ui:define name="additionalMenus">
<rich:menuItem value="Create" icon="images/New16.gif" submitMode="none">
<a4j:support event="onclick" immediate="true"
action="#{orderManager.createOrder}"
reRender="addQuoteForm"
oncomplete="#{rich:component('addQuoteModal')}.show()"/>
</rich:menuItem>
<rich:menuItem value="Open" icon="images/Open16.gif" submitMode="none">
<a4j:support event="onclick" immediate="true"
action="#{orderManager.openOrder}"/>
</rich:menuItem>
<rich:menuItem submitMode="none" value="Delete" icon="images/trash.png">
<a4j:support event="onclick" immediate="true"
reRender="deleteQuoteModal"
oncomplete="#{rich:component('deleteQuoteModal')}.show()"/>
</rich:menuItem>
<rich:dropDownMenu>
<f:facet name="label">
<h:panelGrid cellpadding="0" cellspacing="0" columns="2"
style="vertical-align:middle">
<h:graphicImage value="images/Print16.gif" />
<h:outputText value="Print"></h:outputText>
</h:panelGrid>
</f:facet>
<rich:menuItem submitMode="none" value="Selected">
<a4j:support event="onclick"
action="#{orderManager.setFocexec('quote')}"
oncomplete="openUrl();"/>
</rich:menuItem>
<rich:menuItem submitMode="none" value="Comparison">
<a4j:support event="onclick"
action="#{orderManager.setFocexec('comparison')}"
oncomplete="openUrl();"/>
</rich:menuItem>
</rich:dropDownMenu>
</ui:define>
<ui:define name="mainbody">
<rich:messages layout="list" ajaxRendered="true"
globalOnly="true"
infoClass="infoMessage" warnClass="errorMessage"
errorClass="errorMessage" fatalClass="errorMessage" />
<a4j:jsFunction name="openUrl" data="#{orderManager.reportUrl}"
oncomplete="window.open.apply(null, data)">
</a4j:jsFunction>
<h:panelGrid columns="2" width="500px">
<h:panelGrid columns="1" width="120px">
<h:outputText value="Selected quote:"/>
</h:panelGrid>
<h:panelGrid id="selectedOrder" columns="1" width="700px">
<h:outputText value="#{currentOrder.selectionText}" style="font-weight:bold" rendered="#{currentOrder != null}"/>
<h:outputText value="None" style="font-weight:bold" rendered="#{currentOrder == null}"/>
</h:panelGrid>
</h:panelGrid>
<rich:spacer style='display:block' height="5"/>
<a4j:region>
<rich:extendedDataTable id="quoteQueue" var="order"
value="#{orderManager.orderTable.dataModel}"
width="750px" height="600px"
sortMode="#{orderManager.orderTable.sortMode}"
selection="#{orderManager.orderTable.selection}">
<rich:column id="company" width="300px" style="text-align:left" sortable="true" sortBy="#{order.customerCompany.compName}">
<f:facet name="header">
<h:outputText value="Company" />
</f:facet>
<h:outputText value="#{order.customerCompany.compName}"></h:outputText>
</rich:column>
<rich:column width="90px" style="text-align:left">
<f:facet name="header">
<h:outputText value="Created" />
</f:facet>
<h:outputText value="#{order.createDate}"><f:convertDateTime dateStyle="full" type="date" pattern="yyyy.MM.dd"/> </h:outputText>
</rich:column>
<rich:column width="200px" style="text-align:left">
<f:facet name="header">
<h:outputText value="Description" />
</f:facet>
<h:outputText value="#{order.description}"></h:outputText>
</rich:column>
<rich:column width="100px" style="text-align:left">
<f:facet name="header">
<h:outputText value="Quote Status" />
</f:facet>
<h:outputText value="#{order.approvalStatus}"></h:outputText>
</rich:column>
<rich:column width="80px" style="text-align:left">
<f:facet name="header">
<h:outputText value="Opp ID" />
</f:facet>
<h:outputText value="#{order.opportunityId}"></h:outputText>
</rich:column>
<a4j:support reRender="selectedOrder"
event="onselectionchange"
action="#{orderManager.selectOrder}">
</a4j:support>
</rich:extendedDataTable>
</a4j:region>
</ui:define>
<ui:define name="modalpanels">
<rich:modalPanel id="addQuoteModal" autosized="true">
<f:facet name="header">
<h:outputText value="Create Quote" style="padding-right:15px;" />
</f:facet>
<f:facet name="controls">
<h:panelGroup>
<h:graphicImage value="/images/kdeicons/cancel.png" styleClass="hidelink" id="closeAddQuoteModal" />
<rich:componentControl for="addQuoteModal" attachTo="closeAddQuoteModal" operation="hide" event="onclick" />
</h:panelGroup>
</f:facet>
<ui:include src="addQuoteForm.xhtml" />
</rich:modalPanel>
<rich:modalPanel id="deleteQuoteModal" autosized="true">
<f:facet name="header">
<h:outputText value="Delete this quote?"
style="padding-right:15px;" />
</f:facet>
<f:facet name="controls">
<h:panelGroup>
<h:graphicImage value="/images/modal/close.png"
styleClass="hidelink" id="closeDeleteQuoteModal" />
<rich:componentControl for="deleteQuoteModal" attachTo="hidelink2"
operation="hide" event="onclick" />
</h:panelGroup>
</f:facet>
<h:form>
<h:panelGrid columns="1" width="500px" rendered="#{currentOrder != null}">
<h:outputText value="#{currentOrder.selectionText}" style="font-weight:bold"/>
</h:panelGrid>
<h:panelGrid columns="2">
<a4j:commandButton image="/images/ok.gif"
ajaxSingle="true" action="#{orderManager.delete}"
oncomplete="#{rich:component('deleteQuoteModal')}.hide();"
reRender="selectedOrder,quoteQueue" />
<a4j:commandButton image="/images/cancel.gif"
onclick="#{rich:component('deleteQuoteModal')}.hide();return false;" />
</h:panelGrid>
</h:form>
</rich:modalPanel>
</ui:define>
</ui:composition>
-
4. ExtendedDataTable doesn't respect skin?
boy18nj Mar 4, 2011 9:23 AM (in response to ibstmt)your code is alright.
I confirm it is a issue, soon i will let you know workaround, this even does not works here too-
Richfaces v.3.3.3.Final SVN $Revision: 16741
it has been fixed in version RIchfaces v.4.0.0-SNAPSHOT SVN r.22014
-
5. Re: ExtendedDataTable doesn't respect skin?
ilya_shaikovsky Mar 4, 2011 9:26 AM (in response to ibstmt)actually it's a bug.. I found our that this table does not provides the bg-image and only maps the header to additionalBackgroundColor(of skin) instead of headerBackgroudColor.
so to solve the problem you need
http://livedemo.exadel.com/richfaces-demo/richfaces/style.jsf - create ecss as shown there, put to classpath and load using loadstyle
in the css define the .extdt-subheader css class using:
<u:selector name=".extdt-subheader" >
<u:style name="background-color" skin="headerBackgroundColor"/> <!--headerBackgroundColor-->
<u:style name="background-image" > <!--from headerGradientColor to headerBackgroundColor-->
<f:resource f:key="org.richfaces.renderkit.html.GradientA"/>
</u:style>
<u:style name="background-position" value="top left"/>
<u:style name="background-repeat" value="repeat-x"/>
</u:selector>
-
6. Re: ExtendedDataTable doesn't respect skin?
ibstmt Mar 7, 2011 10:51 AM (in response to ibstmt)Some progress... I reformatted the .xcss file using the demo as a model. I no longer get a parsing exception. However, there's no effect: the table still looks the same.
<?xml version="1.0" encoding="UTF-8"?>
<f:template xmlns:f='http:/jsf.exadel.com/template'
xmlns:u='http:/jsf.exadel.com/template/util'
xmlns="http://www.w3.org/1999/xhtml" >
<f:verbatim><![CDATA[
.extdt-subheader {
background-position : top left;
background-repeat : repeat-x;
}
]]></f:verbatim>
<u:selector name=".extdt-subheader">
<u:style name="background-color" skin="headerBackgroundColor"/> <!--headerBackgroundColor-->
<u:style name="background-image" > <!--from headerGradientColor to headerBackgroundColor-->
<f:resource f:key="org.richfaces.renderkit.html.GradientA"/>
</u:style>
<u:style name="background-position" value="top left"/>
<u:style name="background-repeat" value="repeat-x"/>
</u:selector>
</f:template>