Bloqueio De Textarea Após X Caracteres

#1 KiTTo

Novato no fórum

Usuários
20 posts

Sexo:Não informado
Localidade:Porto Alegre - RS

Posted 10/07/2009, 15:38

Olá pessoal!!!

Cara, faz muuuuito tempo que não apareço por aqui graças ao meu infeliz distanciamento do 'web development' =/

Mas então, estou trabalhando numa agencia de viagens e acabei por ficar responsável pela manutenção do site e estou implementando um serviço de envio de SMS pelo nosso site.

Acontece que esse serviço (entre outras restrições e características chatas) tem um limite de 147 caracteres, no entando, este limite inclui o número de destino do sms (12 caracteres: 55xx88888888) o nome da pessoa (variavel, mas com limite de 15) e a mensagem (variavel da mesma forma). Como o número do telefone de destino é fixo, contemos que a mensagem tem que ter até 135 caracteres.

Primeiro desafio: Conseguir somar a quantidade de caracteres dos dois campos do formulário. Depois de pesquisar, quebrar a cabeça e morrer tentando, cheguei ao seguinte script:

<html><head>	<title>Teste</title>		<script language="JavaScript">        function soma() {            totalChar = ((form.nome.value.length*1) + (form.texto.value.length*1));            maximo = "135";            if (totalChar <= maximo) {                form.total.value = maximo - totalChar;            } else {                alert("Pare por aí!");            }	        }        </script></head><body>    <form name="form">        <input name="nome" size="20" onKeyDown="soma()" onKeyUp="soma()"><br>         <textarea name="texto" rows="4" cols="35" onKeyDown="soma()" onKeyUp="soma()"></textarea><br>        Voce ainda pode digitar: <input name="total" value="135" size="1" readonly> caracteres.<br>       </form></body></html>

Até aí tudo perfeito, porque consegui o que eu queria. Porém, entretanto, todavia, contudo, vem o meu...
Segundo desafio: Fazer com que JS trave ambos os campos ao verificar que a variavel totalChar for igual a variavel maximo. É aí que vocês, anjos e gurus do desenvolvimento web entram

. Preciso que esse controle seja feito, se não da erro no serviço de envio de sms e mesmo dando erro, o valor do envio é cobrado ¬¬

Alguém pode me ajudar?
Conto com vocês!

Obrigado!

Edição feita por: KiTTo, 10/07/2009, 15:40.

#2 Feko

Normal

Usuários
87 posts

Sexo:Não informado
Localidade:Balneário Camboriú - SC

Posted 11/07/2009, 15:49

Acho que um return pode solucionar seu problema... tente o seguinte (Usando seu código):

[codebox]<html>
<head>
<title>Teste</title>
<script language="JavaScript">
function soma() {
var totalChar = parseInt(form.nome.value.length) + parseInt(form.texto.value.length);
maximo = 135;
if (totalChar <= maximo) {
form.total.value = maximo - totalChar;
return true;
} else {
alert("Pare por aí!");
return false;
}
}
</script>
</head>
<body>
<form name="form">
<input name="nome" size="20" onKeyDown="return soma()" onKeyUp="return soma()"><br>
<textarea name="texto" rows="4" cols="35" onKeyDown="return soma()" onKeyUp="return soma()"></textarea><br>
Voce ainda pode digitar: <input name="total" value="135" size="1" readonly> caracteres.<br>
</form>
</body>
</html>[/codebox]

Se por travar o campo, você quer dizer deixar ele como somente leitura, tente: document.form.texto.disabled=true;
Dois detalhes:
Primeiro, que provavelmente essa verificação vai impedir de o usuário navegar pelo texto digitado usando setas, quando o texto atingi o limite. O mesmo ocorrerá com delete, backspace, pageup, pagedown... Você deve adicionar um filtro dentro da função para verificar quais teclas podem passar.
E segundo, por favor, faça uma verificação no lado do servidor também.
Abraços.

#3 KiTTo

Novato no fórum

Usuários
20 posts

Sexo:Não informado
Localidade:Porto Alegre - RS

Posted 13/07/2009, 11:04

Olá amigo!
Primeiramente, obrigado pela resposta!!!

Ja havia tentado com esse return, porém o problema é que nada acontece. Quanto ao alert, ele funciona, mas ainda consigo inserir novos caracteres.

Quanto a 'bloquear' o campo, nao pensei em desabilita-lo, mas essa ideia de colocar esses filtros é válida... Poderia dar maiores detalhes sobre o funcionamento dele?

Grande abraço e mais uma vez, obrigado pela resposta!!!

#1 KiTTo

#2 Feko

#3 KiTTo

1 user(s) are reading this topic

Entrar