<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>Gilliard Cordeiro &#187; bookmarking</title>
	<atom:link href="http://blog.gilliard.eti.br/tag/bookmarking/feed/" rel="self" type="application/rss+xml" />
	<link>http://blog.gilliard.eti.br</link>
	<description>tá nervoso? vai programar!</description>
	<lastBuildDate>Tue, 25 May 2010 20:00:10 +0000</lastBuildDate>
	<generator>http://wordpress.org/?v=2.9.2</generator>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
			<item>
		<title>URLs amigáveis no JSF 2.0</title>
		<link>http://blog.gilliard.eti.br/2009/05/urls-amigaveis-no-jsf-2/</link>
		<comments>http://blog.gilliard.eti.br/2009/05/urls-amigaveis-no-jsf-2/#comments</comments>
		<pubDate>Thu, 28 May 2009 03:36:19 +0000</pubDate>
		<dc:creator>Gilliard Cordeiro</dc:creator>
				<category><![CDATA[JSF]]></category>
		<category><![CDATA[JavaEE]]></category>
		<category><![CDATA[bookmarking]]></category>
		<category><![CDATA[JavaServer Faces]]></category>

		<guid isPermaLink="false">http://blog.gilliard.eti.br/?p=163</guid>
		<description><![CDATA[Hoje vou falar de mais uma novidade do JSF 2, cuja falta era motivo de muita reclamação: URLs amigávies, bookmarking, método GET e outros nomes que podemos dar. O suporte a essa nova funcionalidade é dado por dois pares de componentes, de um lado h:button e h:link e do outro f:metadata e f:viewParam.
Os componentes h:button [...]]]></description>
			<content:encoded><![CDATA[<p>Hoje vou falar de mais uma novidade do JSF 2, cuja falta era motivo de muita reclamação: URLs amigávies, bookmarking, método GET e outros nomes que podemos dar. O suporte a essa nova funcionalidade é dado por dois pares de componentes, de um lado h:button e h:link e do outro f:metadata e f:viewParam.</p>
<p>Os componentes h:button e h:link servem para originar as ações jsf assim como os componentes h:command{Button|Link}, porém usando GET em vez de POST. Esses componentes possuem um atributo chamado <strong>outcome</strong>, que representa a regra de navegação do JSF, assim como seria colocar uma String diretamente na action do h:command{Button|Link}. Para passar parâmetros colocamos a tag f:param dentro do h:link ou h:button.</p>
<p>Como exemplo vamos ver uma aplicaçãozinha que tem uma tela de listagem e outra de visualização de Pessoas. A seguir um trecho da página de listagem de pessoas, <strong>listarPessoas.xhtml</strong>:</p>

<div class="wp_syntax"><div class="code"><pre class="xml" style="font-family:monospace;"><span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;h:form<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
	<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;h:dataTable</span> <span style="color: #000066;">value</span>=<span style="color: #ff0000;">&quot;#{pessoaController.pessoas}&quot;</span> <span style="color: #000066;">var</span>=<span style="color: #ff0000;">&quot;pessoa&quot;</span><span style="color: #000000; font-weight: bold;">&gt;</span></span>
		<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;h:column<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
			#{pessoa.nome}
		<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/h:column<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
		<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;h:column<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
			<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;h:link</span> <span style="color: #000066;">outcome</span>=<span style="color: #ff0000;">&quot;/verPessoa&quot;</span> <span style="color: #000066;">value</span>=<span style="color: #ff0000;">&quot;Editar&quot;</span><span style="color: #000000; font-weight: bold;">&gt;</span></span>
				<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;f:param</span> <span style="color: #000066;">name</span>=<span style="color: #ff0000;">&quot;pessoa&quot;</span> <span style="color: #000066;">value</span>=<span style="color: #ff0000;">&quot;#{pessoa.nome}&quot;</span><span style="color: #000000; font-weight: bold;">/&gt;</span></span>
			<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/h:link<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
		<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/h:column<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
	<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/h:dataTable<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/h:form<span style="color: #000000; font-weight: bold;">&gt;</span></span></span></pre></div></div>

<p>Nesse exemplo, no outcome eu já estou usando o esquema novo de navegação comentado no <a href="http://blog.gilliard.eti.br/2009/05/implicit-navigation-jsf-2/">post passado</a>. O link acima vai gerar uma url parecida com <strong><em>http://localhost:8080/exemplojsf2/verPessoa.jsf?pessoa=fulano_0</em></strong>.</p>
<p>Agora do lado da página que recebe a requisição temos os componentes f:metadata e f:viewParam. A primeira é apenas uma tag que engloba as f:viewParam. Já as tags f:viewParam se comportam de forma muito parecida com um h:inputText, podemos dizer que praticamente a única diferença é no input a gente digita em um formulário, enquanto na f:viewParam escrevemos na URL.</p>
<p>A tag f:viewParam possue os seguintes atributos: converter, converterMessage, required, requiredMessage, validator, validatorMessage, value, valueChangeListener, maxlength e for (este último voltado para o novo esquema de component composition do Facelets). Como podemos ver, é praticamente um h:inputText.</p>
<p>Vamos ver então um trecho do código da página que recebe a requisição, <strong>verPessoa.xhtml</strong>:</p>

<div class="wp_syntax"><div class="code"><pre class="xml" style="font-family:monospace;"><span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;f:view<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
	<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;f:metadata<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
	    	<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;f:viewParam</span> <span style="color: #000066;">name</span>=<span style="color: #ff0000;">&quot;pessoa&quot;</span> <span style="color: #000066;">value</span>=<span style="color: #ff0000;">&quot;#{pessoaController.pessoaSelecionada}&quot;</span> <span style="color: #000000; font-weight: bold;">/&gt;</span></span>
   	<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/f:metadata<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;h:head<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
    <span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;title<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>Ver Pessoa<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/title<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/h:head<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;h:body<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
	<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;h:form<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
		Nome: #{pessoaController.pessoaSelecionada.nome}
	<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/h:form<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/h:body<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/f:view<span style="color: #000000; font-weight: bold;">&gt;</span></span></span></pre></div></div>

<p>Não precisei colocar um converter no f:viewParam pois configurei um converter &#8220;<strong>forClass</strong>&#8221; como veremos mais a frente.</p>
<p>Agora a nossa classe</p>

<div class="wp_syntax"><div class="code"><pre class="java" style="font-family:monospace;"><span style="color: #000000; font-weight: bold;">public</span> <span style="color: #000000; font-weight: bold;">class</span> Pessoa <span style="color: #009900;">&#123;</span>
&nbsp;
	<span style="color: #000000; font-weight: bold;">private</span> <span style="color: #003399;">String</span> nome<span style="color: #339933;">;</span>
&nbsp;
	<span style="color: #000000; font-weight: bold;">public</span> Pessoa<span style="color: #009900;">&#40;</span><span style="color: #009900;">&#41;</span> <span style="color: #009900;">&#123;</span>
	<span style="color: #009900;">&#125;</span>
	<span style="color: #000000; font-weight: bold;">public</span> Pessoa<span style="color: #009900;">&#40;</span><span style="color: #003399;">String</span> nome<span style="color: #009900;">&#41;</span> <span style="color: #009900;">&#123;</span>
		<span style="color: #000000; font-weight: bold;">this</span>.<span style="color: #006633;">nome</span> <span style="color: #339933;">=</span> nome<span style="color: #339933;">;</span>
	<span style="color: #009900;">&#125;</span>
&nbsp;
	<span style="color: #666666; font-style: italic;">//getter e setter suprimido</span>
<span style="color: #009900;">&#125;</span></pre></div></div>

<p>Isso mesmo, a classe é complexa desse jeito  <img src='http://blog.gilliard.eti.br/wp-includes/images/smilies/icon_biggrin.gif' alt=':D' class='wp-smiley' /> </p>
<p>Como o intuito é só um exemplo, eu nem me preocupei com banco de dados ou algum mecanismo mais interessante, apenas criei um conversor para mostrar que o novo esquema não permite apenas o uso de Strings. Segue o código do conversor:</p>

<div class="wp_syntax"><div class="code"><pre class="java" style="font-family:monospace;">@FacesConverter<span style="color: #009900;">&#40;</span>forClass<span style="color: #339933;">=</span>Pessoa.<span style="color: #000000; font-weight: bold;">class</span><span style="color: #009900;">&#41;</span>
<span style="color: #000000; font-weight: bold;">public</span> <span style="color: #000000; font-weight: bold;">class</span> PessoaConverter <span style="color: #000000; font-weight: bold;">implements</span> Converter <span style="color: #009900;">&#123;</span>
&nbsp;
	@Override
	<span style="color: #000000; font-weight: bold;">public</span> <span style="color: #003399;">Object</span> getAsObject<span style="color: #009900;">&#40;</span>FacesContext context, UIComponent component, <span style="color: #003399;">String</span> string<span style="color: #009900;">&#41;</span> <span style="color: #009900;">&#123;</span>
&nbsp;
		<span style="color: #000000; font-weight: bold;">return</span> <span style="color: #000000; font-weight: bold;">new</span> Pessoa<span style="color: #009900;">&#40;</span>string<span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
	<span style="color: #009900;">&#125;</span>
&nbsp;
	@Override
	<span style="color: #000000; font-weight: bold;">public</span> <span style="color: #003399;">String</span> getAsString<span style="color: #009900;">&#40;</span>FacesContext context, UIComponent component, <span style="color: #003399;">Object</span> object<span style="color: #009900;">&#41;</span> <span style="color: #009900;">&#123;</span>
&nbsp;
		<span style="color: #000000; font-weight: bold;">return</span> <span style="color: #009900;">&#40;</span><span style="color: #009900;">&#40;</span>Pessoa<span style="color: #009900;">&#41;</span>object<span style="color: #009900;">&#41;</span>.<span style="color: #006633;">getNome</span><span style="color: #009900;">&#40;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
	<span style="color: #009900;">&#125;</span>
&nbsp;
<span style="color: #009900;">&#125;</span></pre></div></div>

<p>E agora nosso managed bean que recebe não uma String, e sim objetos do nosso domínio. Eu falo isso o tempo todo pois preciso deixar isso bem claro, senão eu fico doido de ver uma aplicação usando JSF passando String e Integer de um lado pro outro <img src='http://blog.gilliard.eti.br/wp-includes/images/smilies/icon_sad.gif' alt=':(' class='wp-smiley' /> </p>
<p>Mas tudo bem, deixando o desabafo pra lá vamos ao código:</p>

<div class="wp_syntax"><div class="code"><pre class="java" style="font-family:monospace;">@ManagedBean<span style="color: #009900;">&#40;</span>name<span style="color: #339933;">=</span><span style="color: #0000ff;">&quot;pessoaController&quot;</span><span style="color: #009900;">&#41;</span>
@RequestScoped
<span style="color: #000000; font-weight: bold;">public</span> <span style="color: #000000; font-weight: bold;">class</span> PessoaController <span style="color: #009900;">&#123;</span>
&nbsp;
	<span style="color: #000000; font-weight: bold;">private</span> Pessoa pessoaSelecionada<span style="color: #339933;">;</span>
	<span style="color: #000000; font-weight: bold;">private</span> List<span style="color: #339933;">&lt;</span>pessoa<span style="color: #339933;">&gt;</span> pessoas<span style="color: #339933;">;</span>
&nbsp;
	@PostConstruct
	<span style="color: #000000; font-weight: bold;">public</span> <span style="color: #000066; font-weight: bold;">void</span> init<span style="color: #009900;">&#40;</span><span style="color: #009900;">&#41;</span>
	<span style="color: #009900;">&#123;</span>
		pessoas <span style="color: #339933;">=</span> <span style="color: #000000; font-weight: bold;">new</span> ArrayList<span style="color: #339933;">&lt;</span>pessoa<span style="color: #339933;">&gt;</span><span style="color: #009900;">&#40;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
		<span style="color: #000000; font-weight: bold;">for</span> <span style="color: #009900;">&#40;</span><span style="color: #000066; font-weight: bold;">int</span> i <span style="color: #339933;">=</span> <span style="color: #cc66cc;">0</span><span style="color: #339933;">;</span> i <span style="color: #339933;">&lt;</span> <span style="color: #cc66cc;">10</span><span style="color: #339933;">;</span> i<span style="color: #339933;">++</span><span style="color: #009900;">&#41;</span> <span style="color: #009900;">&#123;</span>
			pessoas.<span style="color: #006633;">add</span><span style="color: #009900;">&#40;</span><span style="color: #000000; font-weight: bold;">new</span> Pessoa<span style="color: #009900;">&#40;</span><span style="color: #0000ff;">&quot;fulano_&quot;</span> <span style="color: #339933;">+</span> i<span style="color: #009900;">&#41;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
		<span style="color: #009900;">&#125;</span>
	<span style="color: #009900;">&#125;</span>
&nbsp;
	<span style="color: #666666; font-style: italic;">//getters e setters suprimidos</span>
<span style="color: #009900;">&#125;</span></pre></div></div>

<p>Acredito que por hoje seja suficiente. Vou ver se em breve escrevo algo mais específico sobre facelets.</p>
]]></content:encoded>
			<wfw:commentRss>http://blog.gilliard.eti.br/2009/05/urls-amigaveis-no-jsf-2/feed/</wfw:commentRss>
		<slash:comments>5</slash:comments>
		</item>
	</channel>
</rss>
