Discussoes de Programacao e Tecnologia

Duvida com input

12 respostas
D
DaitonJr

bom dia a todos…

estou começando no desenvolvimento web com primefaces e estou com duvida de como fazer um inputTex
preciso que ele aceite so numero … preciso que aceite numero no seguinte formato: ‘#.###,00’

alguem pode me ajudar?

Alura Desenvolvimento Front-End React Do primeiro componente à liderança técnica! HTML/CSS/JavaScript fundamental, React com hooks e...

12 Respostas

Hebert_Coelho
Hebert_Coelho

Quem tem format é o próprio JSF.

http://www.mkyong.com/jsf2/jsf-2-convertnumber-example/
http://www.roseindia.net/jsf/convertNumber.shtml
http://www.jsftoolbox.com/documentation/help/12-TagReference/core/f_convertNumber.html

D
DaitonJr

ok vou olhar obrigado…

leonardobhbr
leonardobhbr

amigo voce não podera usar a mascara pois ela tem tamanho fixo tente usar JavaScript segue um exemplo

function mascara(o, f) {
	v_obj = o;
	v_fun = f;
	setTimeout("execmascara()", 1);
}

function execmascara() {
	v_obj.value = v_fun(v_obj.value);
}

function valor(v) {
	v = v.replace(/\D/g, "");
	v = v.replace(/[0-9]{15}/, "inválido");
	v = v.replace(/(\d{1})(\d{11})$/, "$1.$2"); // coloca ponto antes dos
	// últimos 11 digitos
	v = v.replace(/(\d{1})(\d{8})$/, "$1.$2"); // coloca ponto antes dos
	// últimos 8 digitos
	v = v.replace(/(\d{1})(\d{5})$/, "$1.$2"); // coloca ponto antes dos
	// últimos 5 digitos
	v = v.replace(/(\d{1})(\d{1,2})$/, "$1,$2"); // coloca virgula antes dos
	// últimos 2 digitos
	return v;
}

<p:inputText onkeypress="mascara(this, valor)" />
D
DaitonJr

olhei os links mas é so para outputText, preciso q ja fique formatado quando o usuario começar digitar??
eu tentei aqui e nao funcionou… sera que desta forma dos link tem como?

D
DaitonJr

eu nao sei muito bem javaScript olha se fiz certo pq nao rodou por favos...

<?xml version="1.0" encoding="ISO-8859-1" ?>
<!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:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:p="http://primefaces.org/ui">
	
	

<ui:composition template="/template/interna.xhtml">
	<ui:define name="titulo">Tipo Transporte</ui:define>
	<script type="text/javascript">
		function mascara(o, f) {
			v_obj = o;
			v_fun = f;
			setTimeout("execmascara()", 1);
		}

		function execmascara() {
			v_obj.value = v_fun(v_obj.value);
		}

		function valor(v) {
			v = v.replace(/\D/g, "");
			v = v.replace(/[0-9]{15}/, "inválido");
			v = v.replace(/(\d{1})(\d{11})$/, "$1.$2"); // coloca ponto antes dos   
			// últimos 11 digitos   
			v = v.replace(/(\d{1})(\d{8})$/, "$1.$2"); // coloca ponto antes dos   
			// últimos 8 digitos   
			v = v.replace(/(\d{1})(\d{5})$/, "$1.$2"); // coloca ponto antes dos   
			// últimos 5 digitos   
			v = v.replace(/(\d{1})(\d{1,2})$/, "$1,$2"); // coloca virgula antes dos   
			// últimos 2 digitos   
			return v;
		}
	</script>
	<ui:define name="corpo">
		<h:form id="formulario">

			<p:messages />
			<h:inputHidden value="#{tipoTransporteBean.tipoTransporte.id_promotor}" />

			<p:panel header="Cadastro de Promotor">

				<p:toolbar>
					<p:toolbarGroup align="left">
						<p:commandButton action="#{tipoTransporteBean.save}" value="Salvar"
							image="ui-icon ui-icon-disk" ajax="false" />
						<p:spacer width="3" />
						<p:commandButton action="#{tipoTransporteBean.cancelar}"
							value="Cancelar" ajax="false" image="ui-icon ui-icon-cancel" />
					</p:toolbarGroup>
				</p:toolbar>

				<p:spacer height="5" />

				<div id="cadastro">
					<h:panelGrid columns="1" cellpadding="3" style="width:100%">

						<h:panelGrid cellpadding="3" style="width:100%">
							<h:outputLabel value="Descrição: " />
							<p:inputText value="#{tipoTransporteBean.tipoTransporte.descricao}"
								maxlength="200" />
						</h:panelGrid>
					
					</h:panelGrid>

					<h:panelGrid columns="2" cellpadding="3" style="width:100%">

						<h:panelGrid cellpadding="3" style="width:100%">
							<h:outputLabel value="Valor: " />
  							<p:inputText onkeypress="mascara(this, #{tipoTransporteBean.tipoTransporte.valor})" value="#{tipoTransporteBean.tipoTransporte.valor}"/>
								
							
						</h:panelGrid>

						
					
					</h:panelGrid>

					
				</div>
			</p:panel>
		</h:form>

	</ui:define>
</ui:composition>
</html>
D
DaitonJr

esqueci de dizer… onde preciso da mascara é nao linha 74

leonardobhbr
leonardobhbr

o codigo do evento keypress é o seguinte

onkeypress="mascara(this, valor)"

this = proprio input
valor = nome da função JavaScript

D
DaitonJr

ja tentei assim… mas continuar do mesmo jeito…

onde declarei o esta certo??

leonardobhbr
leonardobhbr

Esta errado, ele tem que ficar no head da pagina.

crie uma tag no seu template para voce poder adicionar código no head

D
DaitonJr

tentei tb.. parece q ele nem executa o javaScript pq nao da erro nenhum no console.. postei meu codigo abaixo.. se puder de uma olhar se estar certo por favor..
obrigado pela ajuda

<?xml version="1.0" encoding="ISO-8859-1" ?>
<!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:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:p="http://primefaces.org/ui">
<head>
	<script type="text/javascript">
		function mascara(o, f) {
			v_obj = o;
			v_fun = f;
			setTimeout("execmascara()", 1);
		}

		function execmascara() {
			v_obj.value = v_fun(v_obj.value);
		}

		function valor(v) {
			v = v.replace(/\D/g, "");
			v = v.replace(/[0-9]{15}/, "invalido");
			v = v.replace(/(\d{1})(\d{11})$/, "$1.$2"); // coloca ponto antes dos ultimos 11 digitos   
			v = v.replace(/(\d{1})(\d{8})$/, "$1.$2"); // coloca ponto antes dosi ultimos 8 digitos   
			v = v.replace(/(\d{1})(\d{5})$/, "$1.$2"); // coloca ponto antes dos ultimos 5 digitos   
			v = v.replace(/(\d{1})(\d{1,2})$/, "$1,$2"); // coloca virgula antes dos ultimos 2 digitos   
			return v;
		}
	</script>
</head>


<ui:composition template="/template/interna.xhtml">
	<ui:define name="titulo">Tipo Transporte</ui:define>
	
	<ui:define name="corpo">
		<h:form id="formulario">

			<p:messages />
			<h:inputHidden
				value="#{tipoTransporteBean.tipoTransporte.id_tipo_transporte}" />

			<p:panel header="Cadastro de Promotor">

				<p:toolbar>
					<p:toolbarGroup align="left">
						<p:commandButton action="#{tipoTransporteBean.save}"
							value="Salvar" image="ui-icon ui-icon-disk" ajax="false" />
						<p:spacer width="3" />
						<p:commandButton action="#{tipoTransporteBean.cancelar}"
							value="Cancelar" ajax="false" image="ui-icon ui-icon-cancel" />
					</p:toolbarGroup>
				</p:toolbar>

				<p:spacer height="5" />

				<div id="cadastro">
					<h:panelGrid columns="1" cellpadding="3" style="width:100%">

						<h:panelGrid cellpadding="3" style="width:100%">
							<h:outputLabel value="Descrição: " />
							<p:inputText
								value="#{tipoTransporteBean.tipoTransporte.descricao}"
								maxlength="200" />
						</h:panelGrid>

					</h:panelGrid>

					<h:panelGrid columns="2" cellpadding="3" style="width:100%">

						<h:panelGrid cellpadding="3" style="width:100%">
							<h:outputLabel value="Valor: " />
							<p:inputText onkeypress="mascara(this, valor)"
								value="#{tipoTransporteBean.tipoTransporte.valor}" />
							
							<p:inputText value="#{tipoTransporteBean.tipoTransporte.valor}">
								<f:validateDoubleRange maximum="5"></f:validateDoubleRange>
							</p:inputText>


						</h:panelGrid>



					</h:panelGrid>


				</div>
			</p:panel>
		</h:form>

	</ui:define>
</ui:composition>
</html>
leonardobhbr
leonardobhbr

O código esta certo só não entendi pq vc colocou dois inputs com o mesmo atributo

<h:panelGrid cellpadding="3" style="width:100%">  
                            <h:outputLabel value="Valor: " />  
                            <p:inputText onkeypress="mascara(this, valor)"  
                                value="#{tipoTransporteBean.tipoTransporte.valor}" />  
                              
                            <p:inputText value="#{tipoTransporteBean.tipoTransporte.valor}">  
                                <f:validateDoubleRange maximum="5"></f:validateDoubleRange>  
                            </p:inputText>  
  
  
                        </h:panelGrid>
D
DaitonJr

o input de baixo e pq me disseram pra fazer isso… mas nao deu nao… achei a forma q funcionasse foi a sua… mas nao consegui

Criado 16 de novembro de 2011
Ultima resposta 16 de nov. de 2011
Respostas 12
Participantes 3

Topicos relacionados

Compilar e executar uma classe java pelo prompt do windows 13 respostas [RESOLVIDO] Como executar função JavaScript após página carregada 13 respostas Java.lang.OutOfMemoryError: Java heap space - Como resolver? 11 respostas Como consultar CPF na Receita Federal usando Web Service? 22 respostas Como acessar localhost de forma externa? [RESOLVIDO] 13 respostas
Alura Sistemas operacionais: entenda seu conceito e suas funções Descubra o que são sistemas operacionais, suas funções e tipos. Aprenda tudo de forma clara e objetiva. Não perca tempo!
Casa do Codigo Aprenda JavaScript com Dashboards: Seus primeiros passos... Por Lucas Tauil — Casa do Codigo