[Resolvido] Input Mask Money Primefaces

Front-end
#1

Alguem ae p/ me ajudar???

Estou desenvolvendo um cadastro de serviços

e preciso incluir campos que o usuario digite apenas numeros e
que ja faça a mascara da moeda

segue o codigo do view

[code]

 <h:head >  
				<title>Cadastro de Obrigacoes</title>
				<meta http-equiv="refresh" content="#{session.maxInactiveInterval};url=./../../index.html" />
 								
</h:head>  
  
<h:body>
	<h:form id="form">
	
		<p:layout style="height:1200; widht:500">
			 		
			<p:layoutUnit position="center" style="height:500">
				<p:panelGrid >
					<f:facet name="header">
						<p:row >
								<p:column colspan="6">Cadastro das Aquisições de Serviços</p:column>
						
						</p:row>
					</f:facet>
					<p:row>
						<p:column colspan="2" rowspan="2">
 							<h:outputText value="Ano:" />
			        	 	<p:spacer width="10" height="0"/>
			        	 	<p:selectOneMenu  height="350" panelStyle="width:10%;height:10%" value="#{cadastroClienteControle.anoselecionado}"  >
			    			<f:selectItem itemLabel="Selecione um.." itemValue="" />  
		    					<f:selectItems value="#{cadastroClienteControle.anos}"  
		       				   				   var="ano" itemLabel="#{ano}" itemValue="#{ano}"/>
		        				
		            		</p:selectOneMenu> 
		            		<p:separator/>
		            		<h:outputText value="Mes:" />
		 				   	<p:spacer width="10" height="0"/>   
		       		 		<p:selectOneMenu  height="380" value="#{cadastroClienteControle.messelecionado}"  >
		    			    	<f:selectItem itemLabel="Selecione um.." itemValue="" />  
		    					<f:selectItems value="#{cadastroClienteControle.meses}"  
		       							       var="mes" itemLabel="#{mes.nome}" itemValue="#{mes.id}"/>
		    	         				 <p:column >#{mes.nome}</p:column>
			            	</p:selectOneMenu>   
		
 						</p:column>
 					</p:row>	
					<p:row>
						<p:column colspan="4" >
							<h:outputLabel value="Cliente:" for="selectonemenucliente"/>
							<p:spacer width="10" height="0" /> 
							<p:selectOneMenu id="selectonemenucliente" value="#">
								<f:selectItem itemLabel="Selecione um.." itemValue="" /> 
								<f:selectItems value="#{cadastroClienteControle.clientes}"
											   var="cliente" itemLabel="#{cliente.razao}"/>
							</p:selectOneMenu>
						</p:column>
					</p:row>
					<p:row>
						<p:column colspan="6">
							<h:outputLabel value="Razão do Contratado:" for="razao_contratado" />
							<p:spacer width="10" height="0" /> 
							<p:inputText id="razao_contratado" size="50"/>
						</p:column>
					</p:row>
					<p:row>
						<p:column colspan="2" rowspan="2">
							<p:selectOneRadio value="#{aquisicaoServicosControle.tipoDocumento}">    
              					<f:selectItem itemLabel="CNPJ" itemValue="CNPJ" />    
              					<f:selectItem itemLabel="CPF" itemValue="CPF" />
              					<f:selectItem itemLabel="PIS" itemValue="PIS" />
              					<f:selectItem itemLabel="Outros" itemValue="OUTROS" />  
            				  	<p:ajax event="change" update=":form:mascaraTipoDocumento"/>                 
							</p:selectOneRadio>  
							
							<h:panelGroup id="mascaraTipoDocumento">
			 					<p:inputMask  rendered="#{aquisicaoServicosControle.tipoDocumento eq 'CNPJ'}" mask="99.999.999/9999-99" />  
			 					<p:inputMask  rendered="#{aquisicaoServicosControle.tipoDocumento eq 'CPF'}" mask="99.999.999-99" />  
			 					<p:inputMask  rendered="#{aquisicaoServicosControle.tipoDocumento eq 'PIS'}" mask="99.999.999-**" />  
								<p:inputMask  rendered="#{aquisicaoServicosControle.tipoDocumento eq 'OUTROS'}"/>  
							</h:panelGroup>		
						
							
						</p:column>
 					
					</p:row>
 					<p:row>
	 					<p:column colspan="2">
	 						<h:outputLabel value="Numero da Nota:" for="nf_numero" />
							<p:spacer width="10" height="0" /> 
							<p:inputText id="nf_numero" size="10"/>
	 					</p:column>
	 					<p:column colspan="2">
	 						<h:outputLabel value="Valor:" for="valor" />
							<p:spacer width="10" height="0" /> 
							<h:inputText id="valor"  required="true" />
								
							
	 					</p:column>
	 					
 					</p:row>
					<p:row>
						<p:column colspan="6">
							 <h:outputLabel value="Data de Emissão:" for="calendario" />
							 <p:spacer width="10" height="0" /> 
							 <p:calendar id="calendario" value="#{aquisicaoServicosControle.date1}" showOn="button" />  
						</p:column>
					</p:row>
					<p:row>  
    					<p:column colspan="6" styleClass="ui-widget-header" style="text-align:center;">  
      						<h:outputText value="Darf's Retenções Gerados" />
   						</p:column>  
					</p:row>  	
					<p:row>
						<p:column colspan="1">
							<h:outputLabel value="IR 0561:" for="retencoes_ir_0561" />
							<p:spacer width="10" height="0" /> 
							<p:inputText id="retencoes_ir_0561" size="10"/>
						</p:column>
						<p:column colspan="1">
							<h:outputLabel value="IR 1708:" for="retencoes_ir_1708" />
							<p:spacer width="10" height="0" /> 
							<p:inputText id="retencoes_ir_1708" size="10"/>
						</p:column>
						<p:column colspan="1">
							<h:outputLabel value="IR 3208:" for="retencoes_ir_3208" />
							<p:spacer width="10" height="0" /> 
							<p:inputText id="retencoes_ir_3208" size="10"/>
						</p:column>
						<p:column colspan="1">
							<h:outputLabel value="IR 3280:" for="retencoes_ir_3280" />
							<p:spacer width="10" height="0" /> 
							<p:inputText id="retencoes_ir_3280" size="10"/>
						</p:column>
						<p:column colspan="1">
							<h:outputLabel value="IR 5952:" for="retencoes_ir_5952" />
							<p:spacer width="10" height="0" /> 
							<p:inputText id="retencoes_ir_5952" size="10"/>
						</p:column>
						<p:column colspan="1">
							<h:outputLabel value="IR 8045:" for="retencoes_ir_8045" />
							<p:spacer width="10" height="0" /> 
							<p:inputText id="retencoes_ir_8045" size="10"/>
						</p:column>
					</p:row>
					<p:row>
						<p:column colspan="1" styleClass="ui-widget-header" style="text-align:center;">
							<h:outputText value="Município" />
							
						</p:column>
						<p:column colspan="1" styleClass="ui-widget-header" style="text-align:center;">
							<h:outputText value="Previdência"/>
							
						</p:column>
						
						<p:column colspan="4" styleClass="ui-widget-header" style="text-align:center;">
							<h:outputText value="Observação de Envio"/>
						</p:column>
					</p:row>
					<p:row>
						<p:column colspan="1">
							<h:outputLabel value="ISS:" for="municipio_iss" />
							<p:spacer width="10" height="0" /> 
							<p:inputText id="municipio_iss" size="10"/>
						</p:column>
						<p:column colspan="1">
							<h:outputLabel value="GPS:" for="previdencia_gps" />
							<p:spacer width="10" height="0" /> 
							<p:inputText id="previdencia_gps" size="10"/>
						</p:column>
						<p:column colspan="4">
							<p:inputTextarea autoResize="false"
							maxlength="250"  rows="1" cols="110" 
							value="#{aquisicaoServicosControle.obs_envio}"/>
						</p:column>
					</p:row>
					<p:row>
						<p:column colspan="6" style="align:center">
								<div align="center">
									<p:commandButton value="Cadastrar" label="Cadastrar" onclick="dlg.show()"/>				
								</div>
								
						</p:column>
					</p:row>
				</p:panelGrid>	
			</p:layoutUnit>
 		</p:layout>  
	 </h:form> 
	 <h:form id="formConfirmacao">
	 	<p:dialog widgetVar="dlg" id="dlgconfirmacao">
	 		<h:outputText value="Voce tem certeza sobre este cadastro?" />
	 		<p:commandButton value="Confirmar" label="Confirmar" 
	 		 				 update=":formConfirmacao:mensagem"	onclick="dlg.hide()"/>
	 	</p:dialog>
	 	<p:growl id="mensagem" showDetail="true" sticky="true"/>	
	 </h:form>		
		
</h:body>
[/code]

vi de utilizar o Jquery para realizar a mascara, mas não tive sucesso.

vi para incluir no <h:head> o seguinte trecho


<h:outputScript name="jquery.maskedinput.js" library="jsmi" target="head"/>
      <h:outputScript name="jquery.maskMoney.js" library="jmoney" target="head"/>
      <h:outputScript name="jquery.js" library="j" target="head"/>

    
      <script src="jquery.js" type="text/javascript"></script>
      <script src="jquery.maskMoney.js" type="text/javascript"></script>
      <script src="jquery.maskedinput.js" type="text/javascript"></script>
    	
       <script type="text/javascript">
             jQuery(function($){
             $(".dataNascimento").mask("99/99/99");
             $(".valor").maskMoney({symbol:"R$", decimal:",", thousands:"."});
             });
        </script>

vi um exemplo chamando ele no styleClass e vi outro executando direto no codigo
no atributo onkeypress do componente inputText

fiz o download dos arquivos jquery-1.8.1 e o jquery-mask-money-1.4.1

alguem ae pra ajuda

#2

Ninguem para ajudar???

ja vi em outros topicos que preciso realizar uma conversão de dados tbm

nos meus inputs, mas por ja gostaria de saber da mask, ou se aguem

pode me explicar como utilizar o JQuery com primefaces

#3

nada ainda?

#4

Segundo o showcase do primefaces é assim mesmo…

Mesmo com esse código ele está permitindo letras?

#5

nos InputMask ta blz, funciona, preciso dessa mascara nos
campos valor e nos campos IR

queria chamar o Jquery

mas nao consegui fazer funcionar

#6

Resolvi utilizando uma extensão do primefaces

inputNumber do site

http://code.google.com/p/primefaces-extensions/

utilizei o componente inputNumber

<pe:inputNumber id="valor" value="#" symbol="R$ " />

simples assim, apenas importei 4 jar’s para minha aplicação

segue o link para quem quer utilizar

http://code.google.com/p/primefaces-extensions/wiki/GettingStarted

#7

Olá Luciano,

Funcionou no Chrome e Ie pra vc ? Pra mim só no Firefox.

Vlw

#8

Ow LucianoTulio quais as libs que vc colocou no projeto para funcionar, eu não to conseguindo fazer rodar nem a pau
o inputNumber aki, ele fica como um simples inputText

#9

Importei esses e funcionou:

Apache Commons Lang3 : http://commons.apache.org/lang/download_lang.cgi
Gson: http://code.google.com/p/google-gson/downloads/list

#10

Aqui não funciona nem a pau, eh so colocar os jar e usar o pe nas jsf
ou tem mais coisa para fazer?

#11

Sim. Só importar os jars no teu projeto. Exibe algum erro pra vc ?

#12

Cara não aparece nenhum erro e nem aviso,
mas não funciona

tenso demais

#13

LucianoTulio , tem como vc tirar uma screen shot da sua tela? É pq vc ta fazendo algo q estou apanhando pra conseguir fazer! Ajeitar o layout dos campos dentro do formulário.
Se puder fazer isso, ficarei mto mto grato

Abração

#14

[quote=didobruno]Cara não aparece nenhum erro e nem aviso,
mas não funciona

tenso demais[/quote]

O tópico ta marcado como resolvido, mas vou responder a uma dúvida msm assim.

Acho q já passei por esse problema didobruno. Verifica se o tipo da variável que vc ta colocando no “value” do pe:inputNumber é Double (objeto “Double” e não o tipo primitivo “double”), caso não seja ocorre esse probema msm, e nenhuma msg de erro é printada. Para resolver vc deve alterar o tipo da variável que utiliza no value do inputNumber para Double, ou criar uma classe que implementa a interface javax.faces.convert.Converter e anotá-la com @FacesConverter(value = “nome_do_conversor”). Após criar essa classe vc deve preencher o atributo “converter” do inputNumber com o nome do conversor, ex.: converter=“nome_do_conversor” . Essa classe vai ser chamada pelo JSF pra converter o objeto quando ele for utilizado. Se trata de um conversor de mão dupla, abaixo segue um exemplo de conversor que utiliza uma variável do tipo BigDecimal no inputNumber.

[code]import java.math.BigDecimal;

import javax.faces.component.UIComponent;
import javax.faces.context.FacesContext;
import javax.faces.convert.Converter;
import javax.faces.convert.FacesConverter;

@FacesConverter(value = “convertToBigDecimal”)
public class ConversorBigDecimal implements Converter {

@Override
public Object getAsObject(FacesContext arg0, UIComponent arg1, String arg2) {

    BigDecimal valor = null;

    if (arg2 != null) {
        if (arg2.isEmpty() == false) {
            valor = new BigDecimal(arg2);
        }
    }

    return valor;
}

@Override
public String getAsString(FacesContext arg0, UIComponent arg1, Object arg2) {
    return arg2.toString();
}

}[/code]

Qualquer dúvida, estamos ai.

#15