Ir para conteúdo

POWERED BY:

Arquivado

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

Iniciante1

Limitar quantidade mínima de caracteres em um input

Por , em Javascript

Recommended Posts

Iniciante1    0

Iniciante1
Postado

Olá pessoal!

 

Gostaria de saber se alguém poderia me dar uma força pra montar um algoritmo de controle de quantidade mínima de caracteres digitados em um input text.

 

Ex: Se o usuário digitar menos do que 5 caracteres exibe um alert informando que ele deve inserir no mínimo 5 caracteres.

 

 

Desde já agradeço..

Compartilhar este post

Link para o post
Compartilhar em outros sites

William Bruno    1501

William Bruno
Postado

acesse o atributo .value do objeto input, e depois a propriedade .length desse value.

 

com isso você saberá qntos caracteres tem. Dai em diante, basta um simples if, com o operador de comparação <

Compartilhar este post

Link para o post
Compartilhar em outros sites

alcaidedigital    57

alcaidedigital
Postado

Um exemplo de minimo e maximo

<script language="javascript" type="text/javascript">
function limitText(limitField, limitCount, limitNum) {
if (limitField.value.length > limitNum) {
	limitField.value = limitField.value.substring(0, limitNum);
} else {
	limitCount.value = limitNum - limitField.value.length;
}
}
function send(form){
if(form.limitedtextarea.value.length >= 5){
	form.submit();
}else{
	alert("Digite o minimo")
}
}
</script>

 

 

<form name="myform">
<textarea name="limitedtextarea" onKeyDown="limitText(this.form.limitedtextarea,this.form.countdown,100);" 
onKeyUp="limitText(this.form.limitedtextarea,this.form.countdown,100);">
</textarea><br>
<font size="1">(Minimo:5, Maximo: 100)<br>
Voce pode digitar <input readonly type="text" name="countdown" size="3" value="100"></font>
<input type="button" value="enviar" onclick="send(this.form);">
</form>

Compartilhar este post

Link para o post
Compartilhar em outros sites

Dii    15

Dii
Postado

Vou dar um exemplo utilizando a biblioteca jQuery.

 

<html>
<head>
<script type='text/javascript' src='http://code.jquery.com/jquery-1.5.1.min.js'></script>
<script type='text/javascript'>
$(document).ready(function(){
// Pega o ID do formulário e efetua o evento SUBMIT.
$('#form').live('submit',function(){
               // Aqui entrarão os valores dos campos, onde pega o ID do campo respectivo e o tamanho do campo.
	var nome = $('#nome').attr('value').length;
	// Aqui entra a condição, onde será mostrado se foi cadastrado ou se precisa dizitar no mínimo 5 caracteres.
	if(nome > 5){

		$('#resultado').html('Cadastro efetuado com sucesso.'); 

	} else {

		alert('Por favor, utilize no mínimo 5 caracteres.');
	}
// Retorna false, o valor do formulário.	
return false;
});

});
</script>
</head>
<body>
<form id='form'>
Nome: <input type='text' id='nome'> <input type='submit' value='Enviar'>
</form>
<!-- Aqui é mostrado o resultado, caso ele seja cadastrado. -->
<div id='resultado'>

</div>
</body>
</html>

 

Nesse formulário , eu utilizei apenas 1 campo, o nome, mas caso queira adicionar mais campos, é só seguir a lógica abaixo.

 

...
Idade: <input type='text' id='idade'>
...

 

E nosso javascript você adicionará embaixo de var.

 

...
idade = $('#idade').attr('value').length;

if(idade > 5){

$('#resultado').html('Cadastro efetuado com sucesso.'); 

} else {

alert('Por favor, utilize no mínimo 5 caracteres.');

}
...

 

Bom, é isso. Espero ter ajudado e tentei simplicar ao máximo para que entendesse, qualquer dúvida posta aqui.

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