tabview question -

UI Components for JSF
joe
Posts: 15
Joined: 09 Apr 2012, 17:44

09 Apr 2012, 18:11

Hi

I am new to JSF and PrimeFcaes. I tried to create a tabbed pane using tabView of primeFaces 2.2, I just copied the example from the user guide as shown below. It worked and displayed three tabs but the background of all tabs is filled with "+", "-", "x", ">" characters! I don't understand why?

Please comment?

<ui:define name="body">
<h:form>

<p:tabView dynamic="true" cache="false" >
<p:tab title="Tab One" >
<h:outputText value="Lorem" />
</p:tab>
<p:tab title="Tab Two">
<h:outputText value="Ipsum" />
</p:tab>
<p:tab title="Tab Three">
<h:outputText value="Dolor" />
</p:tab>
</p:tabView>

Thanks

Joe

smithh032772
Posts: 6144
Joined: 10 Sep 2011, 21:10

09 Apr 2012, 19:01

Reply with your entire xhtml and compare your doctype to others here in other forum topics. See below.

http://lmgtfy.com/?q=site%3Aforum.prime ... rg+doctype
Howard

PrimeFaces 6.0, Extensions 6.0.0, Push (Atmosphere 2.4.0)
TomEE+ 1.7.4 (Tomcat 7.0.68), MyFaces Core 2.2.9, JDK8
JUEL 2.2.7 | OmniFaces | EclipseLink-JPA/Derby | Chrome

Java EE 6 Tutorial|NetBeans|Google|Stackoverflow|PrimeFaces|Apache

joe
Posts: 15
Joined: 09 Apr 2012, 17:44

09 Apr 2012, 20:43

After upgrading primeFace to 3.2 in NetBeans and my project the extra characters went away from the background but it still doesn't work properly. It displays three tabbed panes with grey background but it displays the output text after the grey pane not inside it! Below is my xhtml file.

<!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:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:p="http://primefaces.org/ui">

<h:head>
<ui:define name="title">
<title>Tab2</title>
<h:outputStylesheet name="css/tab.css"/>
</ui:define>

</h:head>
<h:body>
<ui:composition template="template.xhtml">
<ui:define name="body">

<p:tabView>
<p:tab title="Tab One" >
<h:outputText value="Lorem" />
</p:tab>
<p:tab title="Tab Two">
<h:outputText value="Ipsum" />
</p:tab>
<p:tab title="Tab Three">
<h:outputText value="Dolor" />

</p:tab>
</p:tabView>
</ui:define>

</ui:composition>
</h:body>
</html>

joe
Posts: 15
Joined: 09 Apr 2012, 17:44

09 Apr 2012, 20:45

If I remove the template it works properly! So the question is how to use viewPane with template?

Thanks

Joe

smithh032772
Posts: 6144
Joined: 10 Sep 2011, 21:10

09 Apr 2012, 20:50

1. Please label your xhtml files.
2. Add your code/xhtml via Code button above the editor when entering your response; the code button will add code tags, so you can copy/paste your code inside of code tags like below. People here in this forum prefer you to provide your code this way.

Code: Select all

<!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:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:p="http://primefaces.org/ui"> 

<h:head>
<ui:define name="title"> 
<title>Tab2</title>
<h:outputStylesheet name="css/tab.css"/> 
</ui:define>

</h:head>
<h:body>
<ui:composition template="template.xhtml">
<ui:define name="body">

<p:tabView>
<p:tab title="Tab One" >
<h:outputText value="Lorem" />
</p:tab>
<p:tab title="Tab Two">
<h:outputText value="Ipsum" />
</p:tab>
<p:tab title="Tab Three">
<h:outputText value="Dolor" />

</p:tab>
</p:tabView>
</ui:define>

</ui:composition>
</h:body>
</html>
3. reply with your template.xhtml, please.
Howard

PrimeFaces 6.0, Extensions 6.0.0, Push (Atmosphere 2.4.0)
TomEE+ 1.7.4 (Tomcat 7.0.68), MyFaces Core 2.2.9, JDK8
JUEL 2.2.7 | OmniFaces | EclipseLink-JPA/Derby | Chrome

Java EE 6 Tutorial|NetBeans|Google|Stackoverflow|PrimeFaces|Apache

joe
Posts: 15
Joined: 09 Apr 2012, 17:44

09 Apr 2012, 21:02

Hi,

This the exception from GlasFish 3.1 when I try to open that file:

java.lang.NullPointerException
at com.sun.enterprise.v3.services.impl.monitor.MonitorableSelectionKeyHandler$CloseHandler.notifyClosed(MonitorableSelectionKeyHandler.java:94)
at com.sun.enterprise.v3.services.impl.monitor.MonitorableSelectionKeyHandler$CloseHandler.remotlyClosed(MonitorableSelectionKeyHandler.java:90)
at com.sun.grizzly.BaseSelectionKeyHandler.notifyRemotlyClose(BaseSelectionKeyHandler.java:233)
at com.sun.grizzly.util.OutputWriter.notifyRemotelyClosed(OutputWriter.java:353)
at com.sun.grizzly.util.OutputWriter.flushChannel(OutputWriter.java:148)
at com.sun.grizzly.util.OutputWriter.flushChannel(OutputWriter.java:76)
at com.sun.grizzly.http.SocketChannelOutputBuffer.flushChannel(SocketChannelOutputBuffer.java:326)
at com.sun.grizzly.http.SocketChannelOutputBuffer.flushBuffer(SocketChannelOutputBuffer.java:398)
at com.sun.grizzly.http.SocketChannelOutputBuffer.endRequest(SocketChannelOutputBuffer.java:389)
at com.sun.grizzly.http.ProcessorTask.action(ProcessorTask.java:1090)
at com.sun.grizzly.tcp.Response.action(Response.java:268)
at com.sun.grizzly.tcp.Response.finish(Response.java:412)
at org.apache.catalina.connector.OutputBuffer.close(OutputBuffer.java:341)
at org.apache.catalina.connector.CoyoteOutputStream.close(CoyoteOutputStream.java:187)
at java.nio.channels.Channels$WritableByteChannelImpl.implCloseChannel(Channels.java:469)
at java.nio.channels.spi.AbstractInterruptibleChannel.close(AbstractInterruptibleChannel.java:115)
at com.sun.faces.application.resource.ResourceHandlerImpl.handleResourceRequest(ResourceHandlerImpl.java:296)
at javax.faces.application.ResourceHandlerWrapper.handleResourceRequest(ResourceHandlerWrapper.java:125)
at org.primefaces.application.PrimeResourceHandler.handleResourceRequest(PrimeResourceHandler.java:99)
at javax.faces.webapp.FacesServlet.service(FacesServlet.java:591)
at org.apache.catalina.core.StandardWrapper.service(StandardWrapper.java:1539)
at org.apache.catalina.core.StandardWrapperValve.invoke(StandardWrapperValve.java:281)
at org.apache.catalina.core.StandardContextValve.invoke(StandardContextValve.java:175)
at org.apache.catalina.core.StandardPipeline.doInvoke(StandardPipeline.java:655)
at org.apache.catalina.core.StandardPipeline.invoke(StandardPipeline.java:595)
at com.sun.enterprise.web.WebPipeline.invoke(WebPipeline.java:98)
at com.sun.enterprise.web.PESessionLockingStandardPipeline.invoke(PESessionLockingStandardPipeline.java:91)
at org.apache.catalina.core.StandardHostValve.invoke(StandardHostValve.java:162)
at org.apache.catalina.connector.CoyoteAdapter.doService(CoyoteAdapter.java:330)
at org.apache.catalina.connector.CoyoteAdapter.service(CoyoteAdapter.java:231)
at com.sun.enterprise.v3.services.impl.ContainerMapper.service(ContainerMapper.java:174)
at com.sun.grizzly.http.ProcessorTask.invokeAdapter(ProcessorTask.java:828)
at com.sun.grizzly.http.ProcessorTask.doProcess(ProcessorTask.java:725)
at com.sun.grizzly.http.ProcessorTask.process(ProcessorTask.java:1019)
at com.sun.grizzly.http.DefaultProtocolFilter.execute(DefaultProtocolFilter.java:225)
at com.sun.grizzly.DefaultProtocolChain.executeProtocolFilter(DefaultProtocolChain.java:137)
at com.sun.grizzly.DefaultProtocolChain.execute(DefaultProtocolChain.java:104)
at com.sun.grizzly.DefaultProtocolChain.execute(DefaultProtocolChain.java:90)
at com.sun.grizzly.http.HttpProtocolChain.execute(HttpProtocolChain.java:79)
at com.sun.grizzly.ProtocolChainContextTask.doCall(ProtocolChainContextTask.java:54)
at com.sun.grizzly.SelectionKeyContextTask.call(SelectionKeyContextTask.java:59)
at com.sun.grizzly.ContextTask.run(ContextTask.java:71)
at com.sun.grizzly.util.AbstractThreadPool$Worker.doWork(AbstractThreadPool.java:532)
at com.sun.grizzly.util.AbstractThreadPool$Worker.run(AbstractThreadPool.java:513)
at java.lang.Thread.run(Thread.java:722)

I can't publish the full template.xhtml, it contains some private information. My template works fine without primeface; is there anything special in the template file to consider for primeface to work?

smithh032772
Posts: 6144
Joined: 10 Sep 2011, 21:10

09 Apr 2012, 21:08

Please use code button when pasting code, exception details in server log, etc...

Code: Select all

java.lang.NullPointerException
at com.sun.enterprise.v3.services.impl.monitor.MonitorableSelectionKeyHandler$CloseHandler.notifyClosed(MonitorableSelectionKeyHandler.java:94)
at com.sun.enterprise.v3.services.impl.monitor.MonitorableSelectionKeyHandler$CloseHandler.remotlyClosed(MonitorableSelectionKeyHandler.java:90)
at com.sun.grizzly.BaseSelectionKeyHandler.notifyRemotlyClose(BaseSelectionKeyHandler.java:233)
at com.sun.grizzly.util.OutputWriter.notifyRemotelyClosed(OutputWriter.java:353)
at com.sun.grizzly.util.OutputWriter.flushChannel(OutputWriter.java:148)
at com.sun.grizzly.util.OutputWriter.flushChannel(OutputWriter.java:76)
at com.sun.grizzly.http.SocketChannelOutputBuffer.flushChannel(SocketChannelOutputBuffer.java:326)
at com.sun.grizzly.http.SocketChannelOutputBuffer.flushBuffer(SocketChannelOutputBuffer.java:398)
at com.sun.grizzly.http.SocketChannelOutputBuffer.endRequest(SocketChannelOutputBuffer.java:389)
at com.sun.grizzly.http.ProcessorTask.action(ProcessorTask.java:1090)
at com.sun.grizzly.tcp.Response.action(Response.java:268)
at com.sun.grizzly.tcp.Response.finish(Response.java:412)
at org.apache.catalina.connector.OutputBuffer.close(OutputBuffer.java:341)
at org.apache.catalina.connector.CoyoteOutputStream.close(CoyoteOutputStream.java:187)
at java.nio.channels.Channels$WritableByteChannelImpl.implCloseChannel(Channels.java:469)
at java.nio.channels.spi.AbstractInterruptibleChannel.close(AbstractInterruptibleChannel.java:115)
at com.sun.faces.application.resource.ResourceHandlerImpl.handleResourceRequest(ResourceHandlerImpl.java:296)
at javax.faces.application.ResourceHandlerWrapper.handleResourceRequest(ResourceHandlerWrapper.java:125)
at org.primefaces.application.PrimeResourceHandler.handleResourceRequest(PrimeResourceHandler.java:99)
at javax.faces.webapp.FacesServlet.service(FacesServlet.java:591)
at org.apache.catalina.core.StandardWrapper.service(StandardWrapper.java:1539)
at org.apache.catalina.core.StandardWrapperValve.invoke(StandardWrapperValve.java:281)
at org.apache.catalina.core.StandardContextValve.invoke(StandardContextValve.java:175)
at org.apache.catalina.core.StandardPipeline.doInvoke(StandardPipeline.java:655)
at org.apache.catalina.core.StandardPipeline.invoke(StandardPipeline.java:595)
at com.sun.enterprise.web.WebPipeline.invoke(WebPipeline.java:98)
at com.sun.enterprise.web.PESessionLockingStandardPipeline.invoke(PESessionLockingStandardPipeline.java:91)
at org.apache.catalina.core.StandardHostValve.invoke(StandardHostValve.java:162)
at org.apache.catalina.connector.CoyoteAdapter.doService(CoyoteAdapter.java:330)
at org.apache.catalina.connector.CoyoteAdapter.service(CoyoteAdapter.java:231)
at com.sun.enterprise.v3.services.impl.ContainerMapper.service(ContainerMapper.java:174)
at com.sun.grizzly.http.ProcessorTask.invokeAdapter(ProcessorTask.java:828)
at com.sun.grizzly.http.ProcessorTask.doProcess(ProcessorTask.java:725)
at com.sun.grizzly.http.ProcessorTask.process(ProcessorTask.java:1019)
at com.sun.grizzly.http.DefaultProtocolFilter.execute(DefaultProtocolFilter.java:225)
at com.sun.grizzly.DefaultProtocolChain.executeProtocolFilter(DefaultProtocolChain.java:137)
at com.sun.grizzly.DefaultProtocolChain.execute(DefaultProtocolChain.java:104)
at com.sun.grizzly.DefaultProtocolChain.execute(DefaultProtocolChain.java:90)
at com.sun.grizzly.http.HttpProtocolChain.execute(HttpProtocolChain.java:79)
at com.sun.grizzly.ProtocolChainContextTask.doCall(ProtocolChainContextTask.java:54)
at com.sun.grizzly.SelectionKeyContextTask.call(SelectionKeyContextTask.java:59)
at com.sun.grizzly.ContextTask.run(ContextTask.java:71)
at com.sun.grizzly.util.AbstractThreadPool$Worker.doWork(AbstractThreadPool.java:532)
at com.sun.grizzly.util.AbstractThreadPool$Worker.run(AbstractThreadPool.java:513)
at java.lang.Thread.run(Thread.java:722)
Without seeing your template.xhtml, I can only advise you of the following:

http://www.jsfcentral.com/articles/facelets_3.html

http://www.lmgtfy.com/?q=site%3Aforum.p ... ion+insert
Howard

PrimeFaces 6.0, Extensions 6.0.0, Push (Atmosphere 2.4.0)
TomEE+ 1.7.4 (Tomcat 7.0.68), MyFaces Core 2.2.9, JDK8
JUEL 2.2.7 | OmniFaces | EclipseLink-JPA/Derby | Chrome

Java EE 6 Tutorial|NetBeans|Google|Stackoverflow|PrimeFaces|Apache

joe
Posts: 15
Joined: 09 Apr 2012, 17:44

09 Apr 2012, 21:45

Here is my template and tab2.xhtml files. The p:tabview doesn't work with my template.

Code: Select all

tab2.xhtml
<!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:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:p="http://primefaces.org/ui">  

    <h:head>


        <ui:define name="title"> 
            <title>Login</title>
            <h:outputStylesheet name="css/jsfcrud.css"/>  
        </ui:define>

    </h:head>
    <h:body>
        <ui:composition  template="mytemplate.xhtml">
            <ui:define name="body">

                <p:tabView>
                    <p:tab title="Tab One" >
                        <h:outputText value="Lorem" />
                    </p:tab>
                    <p:tab title="Tab Two">
                        <h:outputText value="Ipsum" />
                    </p:tab>
                    <p:tab title="Tab Three">
                        <h:outputText value="Dolor" />

                    </p:tab>
                </p:tabView>
            </ui:define>

        </ui:composition>
    </h:body>
</html>

My Template file: mytemplate.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:p="http://primefaces.org/ui">

    <h:head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
        <link href="./../resources/css/default.css" rel="stylesheet" type="text/css" />
        <link href="./../resources/css/cssLayout.css" rel="stylesheet" type="text/css" />
        <link href="./../resources/css/jsfcrud.css" rel="stylesheet" type="text/css" />
        <title><ui:insert name="title">Template</ui:insert></title>
        <h:outputStylesheet library="css" name="./resources/css/cssLayout.css"/>
    </h:head>

    <h:body>

        <div id="top">
            <ui:insert name="top">
       <h:outputText value="Top"/>
                <hr/>
            </ui:insert>
        </div>
        <div>
            <div id="left" >


                <ui:insert name="left">
                    <h:outputText value="left menue"/>
                </ui:insert>
            </div>
            <div id="body" class="left_content">
                <ui:insert name="body"></ui:insert>
            </div>
        </div>
        <div id="bottom">
            <ui:insert name="bottom">
                <hr/>
                
              
            </ui:insert>
        </div>

    </h:body>

</html>





smithh032772
Posts: 6144
Joined: 10 Sep 2011, 21:10

09 Apr 2012, 21:52

joe wrote:Here is my template and tab2.xhtml files. The p:tabview doesn't work with my template.
Doesn't work? please explain the 'difference' between working and not working.

Make backup of your tab2 xhtml and let me know what happens when your tab2 xhtml 'only' contains the following.

Code: Select all

        <ui:composition  template="mytemplate.xhtml">
        <ui:define name="title"> 
            <title>Login</title>
            <h:outputStylesheet name="css/jsfcrud.css"/>  
        </ui:define>

            <ui:define name="body">

                <p:tabView>
                    <p:tab title="Tab One" >
                        <h:outputText value="Lorem" />
                    </p:tab>
                    <p:tab title="Tab Two">
                        <h:outputText value="Ipsum" />
                    </p:tab>
                    <p:tab title="Tab Three">
                        <h:outputText value="Dolor" />

                    </p:tab>
                </p:tabView>
            </ui:define>

        </ui:composition>
Do you really need the following added to your xhtml files? In a separate test (after completing above), let me know what happens if/when you remove the following:

mytemplate.xhtml

Code: Select all

        <link href="./../resources/css/default.css" rel="stylesheet" type="text/css" />
        <link href="./../resources/css/cssLayout.css" rel="stylesheet" type="text/css" />
        <link href="./../resources/css/jsfcrud.css" rel="stylesheet" type="text/css" />
        <h:outputStylesheet library="css" name="./resources/css/cssLayout.css"/>
    </h:head>
AND

tab2.xhtml

Code: Select all

            <h:outputStylesheet name="css/jsfcrud.css"/>  
PLEASE respond to everything mentioned above.
Howard

PrimeFaces 6.0, Extensions 6.0.0, Push (Atmosphere 2.4.0)
TomEE+ 1.7.4 (Tomcat 7.0.68), MyFaces Core 2.2.9, JDK8
JUEL 2.2.7 | OmniFaces | EclipseLink-JPA/Derby | Chrome

Java EE 6 Tutorial|NetBeans|Google|Stackoverflow|PrimeFaces|Apache

joe
Posts: 15
Joined: 09 Apr 2012, 17:44

09 Apr 2012, 22:46

By "doesn't work" I mean it displays the line of text from the h:outputText tag after the panes, not inside the tabbed panes!
It displays a gray pane for each tab, but the contents of the pane are displayed after the pane, in a separate div.

Removing the head and body tags from the tab2.xhtml doesn't make any difference.

If I remove the

Code: Select all

<link href="./../resources/css/default.css" rel="stylesheet" type="text/css" />
from the template file , then it displays the text inside the pane properly, but I need the link to the css files, I can't remove them.

Any suggection?

Post Reply

Return to “PrimeFaces”

  • Information
  • Who is online

    Users browsing this forum: No registered users and 44 guests