Eu estou usando JSF1.1 RI + Rich 3.1.4
porque eu tenho que usar essa tag: <f:verbatim> toda vez q quero colocar um html na minha pagina jsf??? existe algum jeito de eu colocar html na minha pagina sem precisar dessa tag <f:verbatim>???
<f:verbatim>
A
3 Respostas
R
Bom, eu uso JSF 1.2 com Facelets e nunca precisei de <f:verbatim>, mesmo tendo toneladas de HTML nas páginas.
Não tenho nenhum exemplo real nem experiência de uso de JSF sem Facelets, mas o código na figura em anexo, que preparei recentemente para uma curso introdutório de JSF funcionou perfeitamente com JSF 1.2 sem Facelets e com elementos HTML como
e
. Por sinal, em todo o material preparado (que é bem básico) há vários exemplos simples e nenhum deles precisou de <f:verbatim>. Será que esta necessidade que você falou vale para JSF 1.2?
A
alguem tem um exemplo de facelets ai???
R
Exemplo de Facelets
Aqui usamos um template para todos os sistemas e subtemplates para sistemas específicos. As tecnologias da camada de visão são XHTML/CSS/Facelets/JSF 1.2/JavaScript.
Template principal<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.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">
<head>
<!-- <meta http-equiv="Content-Type" content="application/xhtml+xml; charset=ISO-8859-1" /> -->
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>
<ui:insert name="title"/>
</title>
<link href="#{facesContext.externalContext.request.contextPath}/css/default.css" rel="stylesheet" type="text/css" />
<ui:insert name="links" />
</head>
<body>
<div id="todaPagina">
<form jsfc="h:form">
<a jsfc="h:commandLink" action="#{sistema.logout}"
title="Efetuar logout do sistema" immediate="true">
<img id="botaoFechar" src="#{facesContext.externalContext.request.contextPath}/figuras/botao_fechar.png" />
</a>
</form>
<div id="corpo">
<div id="menu">
<form jsfc="h:form">
<ui:insert name="menu" />
</form>
</div>
<div id="conteudo">
<form jsfc="h:form" id="formulario">
<h1><ui:insert name="titulo" /></h1>
<p>
<h:messages showSummary="true" showDetail="false"/>
</p>
<ui:insert name="conteudo" />
</form>
<form jsfc="h:form" enctype="multipart/form-data">
<ui:insert name="upload" />
</form>
</div>
</div>
<div id="cabecalho" />
<div id="rodape">
<p id="topoPagina">
<a href="#todaPagina">Ir ao Topo</a>
</p>
<ui:insert name="rodape">
<address>
</address>
</ui:insert>
</div>
</div>
</body>
</html>
<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.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">
<ui:composition template="/template.xhtml">
<ui:define name="title">
Sistema de Controle Acadêmico - Pós-Graduação
</ui:define>
<ui:define name="menu">
<ul>
<li><a href="#">Aluno</a>
<ul>
<li>
<a jsfc="h:commandLink" immediate="true" action="#{aluno.consultar}">
Aluno
</a>
</li>
<li>
<a jsfc="h:commandLink" immediate="true" action="#{dadosAcademicos.consultar}">
Dados Acadêmicos
</a>
</li>
<li>
<a jsfc="h:commandLink" immediate="true" action="#{inscricao.consultar}">
Plano de Estudo
</a>
</li>
<li><a href="#">Exigências</a>
<ul>
<li>
<a jsfc="h:commandLink" immediate="true" action="#{linguaEstrangeira.consultar}">
Língua Estrangeira
</a>
</li>
<li>
<a jsfc="h:commandLink" immediate="true" action="#{defesaProjeto.consultar}">
Defesa de Projeto
</a>
</li>
<li>
<a jsfc="h:commandLink" immediate="true" action="#{qualificacao.consultar}">
Qualificação
</a>
</li>
<li>
<a jsfc="h:commandLink" immediate="true" action="#{teseDissertacao.consultar}">
Tese/Dissertação
</a>
</li>
</ul>
</li>
<li>
<a jsfc="h:commandLink" immediate="true" action="#{aluno.consultarParaAproveitamento}">
Aproveitamento de Créditos
</a>
</li>
<li>
<a jsfc="h:commandLink" immediate="true" action="#{lancamentoNota.consultar}">
Lançamento de Notas
</a>
</li>
<li>
<a jsfc="h:commandLink" immediate="true" action="#{prorrogacaoConclusao.consultar}">
Prorrogação de prazo de conclusão
</a>
</li>
<li>
<a jsfc="h:commandLink" immediate="true" action="#{afastamentoTemporario.consultar}">
Afastamentos Temporários
</a>
</li>
<li>
<a jsfc="h:commandLink" immediate="true" action="#{afastamentoDefinitivo.consultar}">
Afastamentos Definitivos
</a>
</li>
</ul>
</li>
<li><a href="#">Cadastro</a>
<ul>
<li>
<a jsfc="h:commandLink" immediate="true" action="#{programa.consultar}">
Programa
</a>
</li>
<li>
<a jsfc="h:commandLink" immediate="true" action="#{curso.consultar}">
Curso
</a>
</li>
</ul>
</li>
<li><a href="#">Disciplina</a>
<ul>
<li>
<a jsfc="h:commandLink" immediate="true" action="#{disciplina.consultar}">
Disciplina
</a>
</li>
<li>
<a jsfc="h:commandLink" immediate="true" action="#{turma.consultar}">
Turma
</a>
</li>
</ul>
</li>
<li><a href="#">Relatório</a>
<ul>
<li>
<a jsfc="h:commandLink" immediate="true" action="#{prazoRegimental.consultar}">
Prazos Regimentais
</a>
</li>
<li>
<a jsfc="h:commandLink" immediate="true" action="#{reportNadaConsta.consultar}">
Nada Consta
</a>
</li>
<li>
<a jsfc="h:commandLink" immediate="true" action="#{reportTempoCurso.consultar}">
Tempo de Curso
</a>
</li>
</ul>
</li>
<li><a href="#">Manutenção</a>
<ul>
<li>
<a jsfc="h:commandLink" immediate="true" action="#{periodoLetivo.consultar}">
Prazos Letivos
</a>
</li>
</ul>
</li>
<li><a href="#">Usuários</a>
<ul>
<li><a jsfc="h:commandLink" action="#{sistema.cadastrarUsuario}" immediate="true">Cadastrar</a></li>
<li><a jsfc="h:commandLink" action="#{sistema.alterarSenha}" immediate="true">Alterar Senha</a></li>
</ul>
</li>
</ul>
</ui:define>
</ui:composition>
</html>
Página específica
<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.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">
<ui:composition template="/geral/template-posgrad.xhtml">
<ui:define name="titulo">Cadastro do Aluno - Dados Pessoais</ui:define>
<ui:define name="links">
<script type="text/javascript" src="/posgrad/script/mascaras.js"></script>
<link rel="stylesheet" type="text/css" href="/posgrad/css/irPara.css"/>
</ui:define>
<ui:define name="conteudo">
<p>
<h:outputText value="Aluno: "/>
<h:outputText value="#{aluno.aluno.matricula}"/>
<h:outputText value=" - "/>
<h:outputText value="#{aluno.aluno.nome}"/>
</p>
<fieldset>
<legend>Dados Gerais</legend>
<p>
<label jsfc="h:outputLabel" for="nome">Nome</label>
<input jsfc="h:inputText" type="text" id="nome" maxlength="80"
value="#{aluno.aluno.nome}" required="true" size="50"
requiredMessage="O nome é obrigatório"/>
</p>
<p>
<label jsfc="h:outputLabel" for="pai">Pai</label>
<input jsfc="h:inputText" type="text" id="pai" maxlength="80"
size="50" value="#{aluno.aluno.pai}"/>
</p>
<p>
<label jsfc="h:outputLabel" for="mae">Mãe</label>
<input jsfc="h:inputText" type="text" id="mae" maxlength="80"
size="50" value="#{aluno.aluno.mae}"/>
</p>
<p>
<label jsfc="h:outputLabel" for="sexo">Sexo</label>
<select jsfc="h:selectOneMenu" id="sexo" value="#{aluno.aluno.sexo}">
<option jsfc="f:selectItems" value="#{pato.sexoItens}" />
</select>
</p>
<p>
<label jsfc="h:outputLabel" for="dataNasc">Data Nascimento</label>
<h:inputText id="dataNasc" value="#{aluno.aluno.dataNascimento}"
converterMessage="A data de nascimento é inválida"
onkeypress="return mascaraData(this, event)" size="10" maxlength="10">
<f:convertDateTime pattern="dd/MM/yyyy" timeZone="Brazil/East" />
</h:inputText>
</p>
<p>
<label jsfc="h:outputLabel" for="estadoCivil">Estado Civil</label>
<select jsfc="h:selectOneMenu" id="estadoCivil" value="#{aluno.aluno.estadoCivil}">
<option jsfc="f:selectItems" value="#{pato.estadosCivilItens}" />
</select>
</p>
<p>
<label jsfc="h:outputLabel" for="paisOrigem">País de Origem</label>
<select jsfc="h:selectOneMenu" id="paisOrigem" onchange="submit()"
value="#{aluno.aluno.paisOrigem}" immediate="true">
<option jsfc="f:selectItems" value="#{pato.paisItens}" />
</select>
</p>
<h:panelGroup rendered="#{!aluno.aluno.estrangeiro}">
<p>
<label jsfc="h:outputLabel" for="naturalidade">Naturalidade</label>
<select jsfc="h:selectOneMenu" id="naturalidade" value="#{aluno.aluno.naturalidade}">
<option jsfc="f:selectItems" value="#{pato.estadosItem}" />
</select>
</p>
</h:panelGroup>
<h:panelGroup rendered="#{aluno.aluno.estrangeiro}">
<p>
<label jsfc="h:outputLabel" for="anoChegada">Ano Chegada</label>
<input jsfc="h:inputText" type="text" id="anoChegada" maxlength="4" size="4"
value="#{aluno.aluno.anoChegada}" />
</p>
</h:panelGroup>
</fieldset>
<fieldset>
<legend>Nacionalidades</legend>
<h:panelGroup rendered="#{!empty aluno.nacionalidadeDataModel}">
<table>
<thead>
<tr>
<th>Nacionalidade</th>
</tr>
</thead>
<tbody>
<tr jsfc="ui:repeat" value="#{aluno.nacionalidadeDataModel}" var="nacionalidade">
<td>#{nacionalidade.gentilicoFeminino}</td>
</tr>
</tbody>
</table>
</h:panelGroup>
<a jsfc="h:commandLink" value="Cadastro de Nacionalidade" action="#{aluno.irParaPaginaNacionalidade}" />
</fieldset>
<fieldset>
<legend>Endereços</legend>
<h:panelGroup rendered="#{!empty aluno.enderecoDataModel}">
<table>
<colgroup>
<col class="colunaTexto" />
<col class="colunaNumero" />
<col class="colunaNumero" />
</colgroup>
<thead>
<tr>
<th scope="col">Logradouro</th>
<th scope="col">Número</th>
<th scope="col">CEP</th>
</tr>
</thead>
<tbody>
<tr jsfc="ui:repeat" value="#{aluno.enderecoDataModel}" var="endereco">
<td>#{endereco.logradouro}</td>
<td>#{endereco.numero}</td>
<td>#{endereco.cep}</td>
</tr>
</tbody>
</table>
</h:panelGroup>
<a jsfc="h:commandLink" value="Cadastro de Endereço" action="#{aluno.irParaPaginaEndereco}" />
</fieldset>
<fieldset>
<legend>Telefones</legend>
<h:panelGroup rendered="#{!empty aluno.telefoneDataModel}">
<table>
<colgroup>
<col class="colunaNumero" />
<col class="colunaNumero" />
<col class="colunaTexto" />
</colgroup>
<thead>
<tr>
<th scope="col">DDD</th>
<th scope="col">Número do Telefone</th>
<th scope="col">Tipo</th>
</tr>
</thead>
<tbody>
<tr jsfc="ui:repeat" value="#{aluno.telefoneDataModel}" var="telefone">
<td>#{telefone.ddd}</td>
<td>#{telefone.numero}</td>
<td>#{telefone.tipoTelefone.descricao}</td>
</tr>
</tbody>
</table>
</h:panelGroup>
<a jsfc="h:commandLink" value="Cadastro de Telefone" action="#{aluno.irParaPaginaTelefone}" />
</fieldset>
<fieldset>
<legend>E-mails</legend>
<h:panelGroup rendered="#{!empty aluno.emailDataModel}">
<table>
<thead>
<tr>
<th>Endereço Eletrônico</th>
</tr>
</thead>
<tbody>
<tr jsfc="ui:repeat" value="#{aluno.emailDataModel}" var="email">
<td><h:outputText value="#{email}" /></td>
</tr>
</tbody>
</table>
</h:panelGroup>
<a jsfc="h:commandLink" value="Cadastro de E-mail" action="#{aluno.irParaPaginaEMail}" />
</fieldset>
<p>
<input jsfc="h:commandButton" type="submit" value="Gravar Inclusão/Alteração"
action="#{aluno.salvarDadosPessoais}" />
</p>
<p>
<span id="irPara">Ir para:</span>
<ul>
<li><a jsfc="h:commandLink" action="paginaDocumentacao">Documentação</a></li>
<li><a jsfc="h:commandLink" action="paginaFormacaoAcademica">Formação</a></li>
<li><a jsfc="h:commandLink" action="paginaFoto">Foto</a></li>
</ul>
</p>
</ui:define>
</ui:composition>
</html>
Espero que ajude.
[edit]
Não há qualquer referência nas páginas a formatação visual porque delegamos 100% disto para o CSS, segundo os padrões W3C.
[/edit]
Criado 16 de abril de 2008
Ultima resposta 17 de abr. de 2008
Respostas 3
Participantes 2
Alura Git Flow: entenda o que é, como e quando utilizar Entenda o que é Git Flow, como funciona seu fluxo com branches como Master, Develop, Feature, Release e Hotfix, além de vantagens e desvantagens.
Casa do Codigo Desmistificando WebAssembly: Alta performance,... Por Raphael Amorim — Casa do Codigo