p:tabView Loading Incorrectly

Question

I am trying to use Primefaces TabView (Primefaces 5.0, Netbeans 8.2, JSF 2.3.2) in a template. However when it loads, it loads as a list of clickable links, with all the tabs' info below it.Image to show the problem Here is my main index page:

<!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://xmlns.jcp.org/jsf/html"
      xmlns:f="http://xmlns.jcp.org/jsf/core"
      xmlns:ui="http://xmlns.jcp.org/jsf/facelets">
    <head>

    </head>
    <h:body>
        <h:form>
        <h1>Select table to interact with:</h1>
        <h:selectOneMenu value="#{eJBTest.table}" onchange="submit()" valueChangeListener="#{eJBTest.loadTemplate}">
            <f:selectItem itemValue="default" itemLabel="Select One"/>
            <f:selectItem itemValue="supplier" itemLabel="Supplier"/>
            <f:selectItem itemValue="part" itemLabel="Part"/>
            <f:selectItem itemValue="sp" itemLabel="SP"/>
        </h:selectOneMenu>
        <ui:include src="#{eJBTest.template}"/>
        </h:form>
    </h:body>
</html>

Here is the loadTemplate method:

public void loadTemplate(ValueChangeEvent event) throws IOException {
        System.out.println("Loading Template");
        table = event.getNewValue().toString();
        template = "/template/" + table + ".xhtml";
        editTemplate = "/template/funct/" + table + "Edit.xhtml";
        newTemplate = "/template/funct/" + table + "New.xhtml";
        deleteTemplate = "/template/funct/" + table + "Delete.xhtml";
        listTemplate = "/template/funct/" + table + "List.xhtml";
        FacesContext.getCurrentInstance().getExternalContext().redirect("index.xhtml");
    }

and one of the tabMenus I am trying to load:

<h:body>
        <ui:composition>
            <p:tabView id="tabView" activeIndex="#{eJBTest.activeSIndex}" dynamic="true">
                <p:tab id="new" title="New">
                    <h:outputText value="Supplier Id: "/><h:inputText value="#{eJBTest.supId}"/><br/>
                    <h:outputText value="Supplier Name: "/><h:inputText value="#{eJBTest.name}"/><br/>
                    <h:outputText value="Supplier Status: "/><h:inputText value="#{eJBTest.status}"/><br/>
                    <h:outputText value="Supplier City: "/><h:inputText value="#{eJBTest.city}"/><br/>
                    <h:commandButton value="Add Supplier" action="#{eJBTest.createNewSupplier()}"/><br/>
                </p:tab>
                <p:tab id="edit" title="Edit">
                    <h:selectOneMenu value="#{eJBTest.keyValue}" valueChangeListener="#{eJBTest.loadSupplier}" onchange="submit()">
                        <f:selectItems value="#{eJBTest.getSupplierId()}"/>
                    </h:selectOneMenu><br/>
                    <div id="text">
                        <h:outputText value="Supplier Name:"/><h:inputText value="#{eJBTest.name}"/><br/>
                        <h:outputText value="Supplier Status:"/><h:inputText value="#{eJBTest.status}"/><br/>
                        <h:outputText value="Supplier City:"/><h:inputText value="#{eJBTest.city}"/><br/>
                        <h:commandButton value="Edit" action="#{eJBTest.editSupplier()}"/>
                    </div>
                </p:tab>
                <p:tab id="delete" title="Delete">
                    <h:selectOneMenu value="#{eJBTest.keyValue}">
                        <f:selectItems value="#{eJBTest.getSupplierId()}"/>
                    </h:selectOneMenu>
                    <h:commandButton value="Delete" action="#{eJBTest.deleteSupplier()}"/>
                    <h:outputText value="#{eJBTest.message}"/>
                </p:tab>
                <p:tab id="list" title="List">
                    <h:outputText value="#{eJBTest.supplierData.toString()}"/>
                </p:tab>
            </p:tabView>
        </ui:composition>
    </h:body>

All three templates are currently doing this, where they worked before. I have no Idea what I've done to cause this.

eJBTest definition is missing, can you post it? Do you really need that `ui:composition`? Why are you putting an `h:body` within an `h:body`? — WoAiNii, Apr 28 '20 at 16:59
In order to not post alot of un-needed code, what part of the eJBTest do you need? @WoAiNii — Michael George, Apr 28 '20 at 17:12
so a`p:inputText` or `p:datatable` works? Most likely not And please run in development mode and you'll see https://stackoverflow.com/questions/18940644/one-or-more-resources-has-the-target-of-head-but-not-head-component-has-been — Kukeltje, Apr 28 '20 at 17:20
@Kukeltje that is exactly what was wrong. Somewhere along the line, I must've changed it from to changing it back fixed it. Is there a way to reroute this question to that one? — Michael George, Apr 28 '20 at 17:24
and without a template? see https://www.stackoverflow.com/tags/jsf/info — Kukeltje, Apr 28 '20 at 17:30
Does this answer your question? [One or more resources has the target of 'head' but not 'head' component has been defined within the view](https://stackoverflow.com/questions/18940644/one-or-more-resources-has-the-target-of-head-but-not-head-component-has-been) — Kukeltje, Apr 28 '20 at 17:49
see the need for a [mcve] in the process of debugging? The template does not play a role, it is not `p;tabview` related. And I voted to close as duplicate. That will 'link' it — Kukeltje, Apr 28 '20 at 18:00

p:tabView Loading Incorrectly

0 Answers0