Controle de Focu com Ajax e Prime

5 de abril de 2012 5 respostas

Diego_Adriano 5 de abril de 2012

Bom dia galera, alguém saberia me dizer se estou fazendo da forma correta o controle do focu dos inputs? Bem, só para explicação, preciso usar o controle do focu pois tenho alguns paineis grid e se eu não fizer esse controle eles acabam navegando somente entre eles com o uso do "TAB"

h:panelGrid columns="6" style="margin-left:40px">
					
		<h:outputText value="Cod: "/>
		<p:inputText id="idCliente"
				size="7"
				value="#{lancamentoBean.lancamento.cliente.id}"/>
					
		<p:commandButton icon="ui-icon-search" ajax="true" 
							 immediate="true" oncomplete="janelaCliente.show()">
					<p:ajax event="blur" update="formLancamento" listener="#{lancamentoBean.busca}" />
		</p:commandButton>
						
		<h:outputText value="Nome: "/>
		<p:autoComplete value="#{lancamentoBean.clienteSelecionado}" completeMethod="#{lancamentoBean.completecliente}" 
				var="cliente" itemValue="#{cliente}" itemLabel="#{cliente.nome} #{cliente.sobrenome}"				 
				converter="Converter"
				size="50"
				onkeyup="this.value = this.value.toUpperCase();">
		      <p:ajax event="blur" update="formLancamento" listener="#{lancamentoBean.buscaSelecionado}" />
		      <p:focus for="numboleto" />
		</p:autoComplete>				
									
		</h:panelGrid>
				
		<h:panelGrid columns="6" style="margin-left:15px">	
							
		<h:outputText value="Boleto: "/>
		<p:inputText id="numboleto"
				 size="7"
				 value="#{lancamentoBean.lancamento.numBoleto}">
			<p:focus for="valboleto" />
			<p:ajax event="blur"/>		 
		</p:inputText>			 
					
		<h:outputText value="Valor: "/>
		<p:inputText id="valboleto"
				 size="7"
				 value="#{lancamentoBean.lancamento.valor}">
			<f:convertNumber minFractionDigits="2" />
		        <p:focus for="parcela" />
			<p:ajax event="blur"/>		 
		</p:inputText>

5 Respostas

dufloth 5 de abr. de 2012

Para o focus funcionar, você deve declará-lo e depois usar no update para atualizá-lo. Segue um exemplo de como eu uso:

…

<p:focus id="focusToData" for="cityName" />
                
  <h:panelGrid id="citiesEntry" columns="1" cellpadding="2">
       <h:outputLabel for="cityCode" value="Código" />
       <p:inputText value="#{citiesBean.city.code}" id="cityCode" label="Código" size="10" maxlength="20" >
            <p:ajax event="change" listener="#{citiesBean.cityFromCode}"update="citiesEntry focusToData"/>
       </p:inputText>

…

Diego_Adriano 5 de abr. de 2012

Bem, eu faço dessa forma para que o Focu seja no id para quando se inicie a pagina:

<p:focus for="idCliente"/>

Dessa forma que eu fiz ele passa sozinho, não espera eu pressionar o Tab …
vou testar como vc sugeriu …

Diego_Adriano 5 de abr. de 2012

Bem, montei da seguinte forma porém ainda tenho o seguinte erro:
Quando o chego no NumBoleto ao invés do focu ser passado para o campo Valor ele volta automaticamente para o campo ID

<p:focus for="idCliente"/>
				
<h:panelGrid columns="6" style="margin-left:40px">
					
	<h:outputText value="Cod: "/>
	<p:inputText id="idCliente"
			 size="7"
			 value="#{lancamentoBean.lancamento.cliente.id}"/>
				
	<p:commandButton icon="ui-icon-search" ajax="true" 
				 immediate="true" oncomplete="janelaCliente.show()">
		<p:ajax event="blur" update="formLancamento" listener="#{lancamentoBean.busca}" />
	</p:commandButton>
						
	<h:outputText value="Nome: "/>
	<p:autoComplete value="#{lancamentoBean.clienteSelecionado}" completeMethod="#{lancamentoBean.completecliente}" 
			var="cliente" itemValue="#{cliente}" itemLabel="#{cliente.nome} #{cliente.sobrenome}"				 
	                converter="Converter"
			size="50"
			onkeyup="this.value = this.value.toUpperCase();">
		<p:ajax event="blur" update="formLancamento" listener="#{lancamentoBean.buscaSelecionado}" />
		<p:ajax event="change" update="numBoleto"/>
	</p:autoComplete>				
								
</h:panelGrid>
			
<h:panelGrid columns="6" style="margin-left:15px">	
							
	<h:outputText value="Boleto: "/>
	<p:inputText id="numboleto"
			 size="7"
			 value="#{lancamentoBean.lancamento.numBoleto}">
		<p:ajax event="change" update="valboleto"/>		 
	</p:inputText>			 
					
	<h:outputText value="Valor: "/>
	<p:inputText id="valboleto"
			 size="7"
			 value="#{lancamentoBean.lancamento.valor}">
		<f:convertNumber minFractionDigits="2" />
		<p:ajax event="change" update="parcela"/>		 
	</p:inputText>

fortescr 25 de jun. de 2012

Olá Diego,

Conseguiu resolver o problema? Estou passando pela mesma situação

Diego_Adriano 25 de jun. de 2012

Então cara … nem consegui viu …tb nem tentei mais …rs

Criado 5 de abril de 2012

Ultima resposta 25 de jun. de 2012

Respostas 5

Participantes 3

5 Respostas

Topicos relacionados