Ir para conteúdo

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

EduardoAugustoPHP

Mascara de Peso com Preenchimento contrário

Por , em Javascript

Recommended Posts

EduardoAugustoPHP    27

EduardoAugustoPHP
Postado

Fala galera...estou aqui mais uma vez buscando uma solução com vocês.

 

enfim....vamos lá!

 

Preciso criar uma máscara JS para peso e que seja mais ou menos assim:

- até 03 zeros antes da virgula;

- máx 04 zeros após a virgula;

- Quando clicar no input, devem aparecer a máscara com os zeros e ir preenchendo de trás pra frente;

 

Ex:
Se o peso for 256g, deve aparecer dessa forma: 0,0256

Se for 1,5kg, deve aparecer 1,5000

 

Fáacil né??

:(

 

Galera, estou alguns dias tentando fazer isso e não estou tendo muito sucesso.

 

Já vi inúmeras dicas do WBruno(moderador) e NADAAAA!!!

sério, estou recorrendo pq estou realmente sem saída.

 

Não sou expert em js e estou bem longe disso.

 

conto com a juda de vcs.

 

abs

Compartilhar este post

Link para o post
Compartilhar em outros sites

William Bruno    1501

William Bruno
Postado

Opa.. cara.. consegui resolver, só precisa refatorar a parte do zeroFill ali no if.(para o código ficar bonito)

<script type="text/javascript">
function id(el){
    return document.getElementById(el);
}
window.onload = function(){
	id('peso').onkeyup = function(){
		var v = this.value,
			integer = v.split(',')[0];


		v = v.replace(/\D/, "");
		v = v.replace(/^[0]+/, "");

		if(v.length <= 4 || !integer)
		{
			if(v.length === 1) v = '0,000' + v;
			if(v.length === 2) v = '0,00' + v;
			if(v.length === 3) v = '0,0' + v;
			if(v.length === 4) v = '0,' + v;
		} else {
			v = v.replace(/^(\d{1,})(\d{4})$/, "$1,$2");
			console.log('ae');
		}

		this.value = v;
	}
};
</script>
<input type="text" name="peso" id="peso" maxlength="8" />

Compartilhar este post

Link para o post
Compartilhar em outros sites

EduardoAugustoPHP    27

EduardoAugustoPHP
Postado

 

SENSACIONAL Bruno!

Realmente resolveu.

 

Passei a noite toda tentando, tentando e tentando. e Hoje pela manhã eu consegui fazer com jQuery mas não funfou no FF (só no chrome).

 

Vou postar aqui o código só pra registro e pra ajudar quem precisar também.

 

Muito obrigado!!

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
	$("#busca").unbind().keypress(function(ev){
		var self = $(this); 
		var caractere = (String.fromCharCode(ev.keyCode).replace(/\D/g, "") - 0) + ""; 
		if(!ev.keyCode) caractere = "";
		var limite = 5; var texto = (self.val().replace(/\D/g, "") - 0) + caractere; 
	while(texto.length < limite) {
		texto = "0" + texto;
	}; 
		self.val(texto.replace(new RegExp("\(\\d{"+(limite-1)+"}$\)"), ",$1")); 
	return false;
	})
	.keyup(function(ev){
	if(!String.fromCharCode(ev.keyCode) - 0 >= 0){
	$(this).keypress()
	}
	})
});
</script>

</head>
<body>
    <input type="text" id="busca" maxlength="8"/>

Mais uma vez, muito obrigado Bruno.

 

Abraço!

Compartilhar este post

Link para o post
Compartilhar em outros sites

William Bruno    1501

William Bruno
Postado

caraca! hauhaua q treca cara!

 

Olha, aproveitei sua dúvida para fazer 2 posts no meu blog. Um já liberei hoje com o código, o outro vai pro ar na segunda-feira.

 

É esse projeto git aqui:

https://github.com/wbruno/formatWeight

 

Refatorei o zeroFill lá que eu tinha dito, e escrevi testes Jasmine pro código.

Compartilhar este post

Link para o post
Compartilhar em outros sites

EduardoAugustoPHP    27

EduardoAugustoPHP
Postado

caraca! hauhaua q treca cara!

 

Olha, aproveitei sua dúvida para fazer 2 posts no meu blog. Um já liberei hoje com o código, o outro vai pro ar na segunda-feira.

 

É esse projeto git aqui:

https://github.com/wbruno/formatWeight

 

Refatorei o zeroFill lá que eu tinha dito, e escrevi testes Jasmine pro código.

Haaa show de bola..!!!

 

Eu fiz uma mudança nele bem básica.

 

Alterei a forma de selecionar e passei pra jQuery. Estou implementando como uma função jquery e logo estou com ela pronta e passo pra vc e a galera aqui! hehe

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Javascript
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.

  Aceito