Mascara e validação usando JQuery

Assuntos Gerais
#1

Boa tarde pessoal !

Estou tentando melhorar as funcoes de mascaramento de campo usando javascript aqui,
mas alguns problemas teem surgido tornando a coisa um pouco complicada para o lado do
javascript …
um amigo meu me disse para pesquisar JQuery, que seria uma biblioteca que facilitaria o uso de javascript …
pois bem … naveguei bastante no site deles mas nao encontrei nada que me ajudasse no meu problema …
o que preciso eh de um codigo que permita ao usuario digitar apenas um range de caracteres (ex : apenas numeros)
, ou seja, se o usuario digitar algo fora do range o evento do clique eh simplesmente cancelado, e nada aparece no campo. Eu fiz isso no javascript, mas alguns problemas de cancelamento de evento acontecem no firefox … como por exemplo ele nao permitir usar o Ctrl + V no campo …

Alguem sabe como eu posso fazer isso usando o JQuery ?

#2

Procure pelo puglin jquery.maskedinput

#3

Opa cara !!!

Valeu meu !! Era bem isso que eu queria !!!

Já implementei aqui, funcionou que é uma maravilha !
vou testar para ver se nao da nenhum bug e semana que vem eu implanto no sistema !!

Valeu gente !

#4

Pessoal,
Estou usando o jquery.maskedinput porém ao preencher um campo cuja máscara é “9.999.999,99” (para um valor moeda), o preenchimento ocorre da esquerda p/ a direita, impossibilitando a correta formatação. Alguém sabe como modificar a direção de preenchimento para q comece sempre da direita para a esqueda? Obrigada.

#5

Voce pode usar o maskInputMoney - https://github.com/plentz/jquery-maskmoney do jQuery

#6

Oi pessoal!
Comigo não está funcionando nenhum do dois plugins, para o campo data coloquei no formulario.jsp:

<script type="text/javascript" src="${pageContext.request.contextPath}/javascript/jquery/jquery.maskedinput-1.2.2.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/javascript/jquery/jquery.maskMoney.0.2.js" ></script>
<script type="text/javascript">
$.noConflict( )
jQuery(function($){
$.mask.addPlaceholder("~","[+-]");
$("#data").mask("99/99/9999");
});

$(function(){
	$("#real").maskMoney({symbol:"R$",decimal:",",thousands:"."});
});
</script>

E nos campos:

<label for="valor">Valor (R$)</label>	
			<input id="real" name="imovel.valor" type="text" value="${imovel.valor }" maxlength="20" /><br /><br />

<label>Data de Inclus&atilde;o</label>
			<input id="data" name="imovel.dtInclusao" type="text" value="<fmt:formatDate pattern='dd/MM/yyyy' value="${imovel.dtInclusao }"/>"/></input><br /><br />

Nada acontece. Será que não funciona se tiver Sitemesh rodando? Coloquei o caminho dos plugins na JSP de conteúdo.
Abraço!

#7

[quote=Guevara]Oi pessoal!
Comigo não está funcionando nenhum do dois plugins, para o campo data coloquei no formulario.jsp:

<script type="text/javascript" src="${pageContext.request.contextPath}/javascript/jquery/jquery.maskedinput-1.2.2.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/javascript/jquery/jquery.maskMoney.0.2.js" ></script>
<script type="text/javascript">
$.noConflict( )
jQuery(function($){
$.mask.addPlaceholder("~","[+-]");
$("#data").mask("99/99/9999");
});

$(function(){
	$("#real").maskMoney({symbol:"R$",decimal:",",thousands:"."});
});
</script>

E nos campos:

<label for="valor">Valor (R$)</label>	
			<input id="real" name="imovel.valor" type="text" value="${imovel.valor }" maxlength="20" /><br /><br />

<label>Data de Inclus&atilde;o</label>
			<input id="data" name="imovel.dtInclusao" type="text" value="<fmt:formatDate pattern='dd/MM/yyyy' value="${imovel.dtInclusao }"/>"/></input><br /><br />

Nada acontece. Será que não funciona se tiver Sitemesh rodando? Coloquei o caminho dos plugins na JSP de conteúdo.
Abraço![/quote]

Aqui funcionou mas não coloquei o $.noConflict( ) . Sobre o sitemesh acho que não faz diferença.

#8

Aqui funcionou assim:

<script type="text/javascript" src="${pageContext.request.contextPath}/javascript/jquery/jquery.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/javascript/jquery/jquery.maskedinput-1.2.2.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/javascript/jquery/jquery.maskMoney.0.2.js"></script>
<script type="text/javascript">
$(document).ready(function() {  

jQuery("#data").mask("99/99/9999");
jQuery("#telefone").mask("(99)9999-9999");
jQuery("#celular").mask("(99)9999-9999");
jQuery("#cpf").mask("999.999.999-99");
jQuery("#real").maskMoney({symbol:"R$",decimal:",",thousands:"."});

});
</script>

Abraço!

#9

Pow galera, valeu mesmo! Estava precisando disso aqui! hehehehe
Só que aqui também só funcionou igual o do Guevara.

Abraços

#10

O maskedinput te obriga a seguir a máscara, preenchendo todos os espaços.

Se quiser limitar o tipo de caracter que pode ser colocado no campo, mas não o tamanho, usa o plugin Alphanumeric. É um plugin bem simples, mas que ajuda e MUITO.

Abs

#11