Primefaces component did not render as expected

Asked

Viewed 102 times

1

As you can see in the image below, the input field is not in the layout of the primefaces. Does anyone know how I can solve?

inserir a descrição da imagem aqui

Below now follows my file . 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:ui="http://java.sun.com/jsf/facelets"
    xmlns:f="http://java.sun.com/jsf/core"
    xmlns:h="http://java.sun.com/jsf/html"
    xmlns:p="http://primefaces.org/ui">
        <h:panelGroup id="cadastro">
            <h:form id="cad">
                <p:panel>
                    <h:outputText value="Cadastro de Habilidades"
                        style="font-size:18px;fontweight:bold" />
                    <p:messages />
                    <p:panelGrid columns="3" styleClass="ui-noborder">
                        <p:outputLabel value="Nome " />
                        <p:inputText id="nome" value="#{habilidademb.habilidade.nome}" size="50" />
                        <p:message for="nome" errorClass="invalid" />
                        </p:panelGrid>
                </p:panel>
            </h:form>
        </h:panelGroup>
</html>

The driver is in the Maven dependencies.

jsf primefaces

1 answer

1


Douglas,

Your XHTML page starts with the component h:panelGroup before the form:

<h:panelGroup id="cadastro">

I suggest you put the form as the first element and use only native components of Primefaces, in your case I would change your code to something like this:

<h:form id="formCadastro">
    <p:panel id="cadastro">
        <p:outputLabel value="Cadastro de Habilidades" />

        <p:messages/>   

        <p:panelGrid columns="3" styleClass="ui-noborder">
            <p:outputLabel value="Nome " />
            <p:inputText id="nome" value="#{habilidademb.habilidade.nome}" size="50" />
            <p:message for="nome" errorClass="invalid" />
        </p:panelGrid>
    </p:panel>
</h:form>

What does style class ui-noborder of the code below?

<p:panelGrid columns="3" styleClass="ui-noborder">

Be careful because depending on what is in this class there are possibilities of the style of your text field being overwritten by other rules that have higher priority.

Do you use theme? Is it working with other components? Send more details so people can better understand your problem and who knows best help you.

I hope this helps...

Good luck!

  • Thank you, rsrs.... I didn’t even remember this question anymore... :)

  • ! :)

Browser other questions tagged jsf primefaces

You are not signed in. Login or sign up in order to post.