(Resolvido) Bloqueio de TextArea após x caracteres

KiTTo · Julho 10, 2009

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 :D. 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!

Editado Julho 10, 2009 por Jonathan Queiroz
Remover palavra "urgente" do título da descrição do tópico

Jonathan Queiroz · Julho 10, 2009

Para limitar a quantidade de caracteres num textarea você pode fazer assim:

var t=document.getElementById("id_do_textarea")
var maximo=500
t.value=t.value.substring(0,maximo)

KiTTo · Julho 10, 2009

Olá Jonathan Queiroz, obrigado pela resposta, mas não quero limitar apenas a textarea, preciso limitar a quantidade geral de caracteres do formulário (input + textarea) e quando chegar ao valor máximo, não permitir que seja inserido novos caracteres...

Um bom exemplo é o formulário de sms da claro: da uma olhadinha aqui

Jonathan Queiroz · Julho 10, 2009

Você pode fazer de forma parecida

var textarea=document.getElementById("id_textrea")
var input=document.getElementById("id_input")
var maximo=500
var qtd_total=textarea.value.length+input.value.length
if(input.length>=qtd_total){
input.value=input.value.substring(0,maximo)
textarea.value=""
}else if(qtd_total>=maximo){
textarea.value=textarea.value.substring(0,maximo-input.length)
}

KiTTo · Julho 13, 2009

Grande amigo!!!

Obrigado mais uma vez pela resposta, porém algo errado acontece...

Testando notei que ao digitar o último caractere disponível todo o texto do textarea desaparece!

Já tentei apenas tirar a linha que zera o valor da textarea, mas ainda assim acontece...

Gostaria que o texto se mantesse na textarea e só fosse permitido colocar novos caracteres se o usuario apagar algum outro.

Tem solução?

Grande abraço e obrigado pela tua força!!!

fiote · Julho 13, 2009

var Destino = document.getElementById("id_input");
var Mensagem = document.getElementById("id_textrea");

var Qt_Max = 135;

var Qt_Destino = Destino.value.length;

if (Qt_Destino > 15) Destino.value = Destino.value.substring(0,15);

var Qt_Destino = Destino.value.length;
var Qt_Mensagem = Mensagem.value.length;

var Qt_Total = Qt_Destino + Qt_Mensagem;

If (Qt_Total > Qt_Max) Mensagem.value = Mensagem.value.substring(0,Qt_Max-Qt_Destino);

Sim, eu gosto de variáveis ^^

Editado Julho 13, 2009 por fiote

KiTTo · Julho 13, 2009

Aeeeee Fioteeee

Funcionou!!

Valeu!!!

Mas me explica aí, qual a grande diferença entre o teu código e o do Jonathan Queiroz?

Aparentemente é a mesma lógica, só algumas variaveis diferente... fiquei sem entender...

Abraço! E mais uma vez, obrigado!!!

Editado Julho 13, 2009 por KiTTo

Jonathan Queiroz · Julho 13, 2009

A diferença é que no meu código estava limpando o textarea se o input já estivesse com a quantidade máxima.

Obs.:

Vou marcar o tópico como Resolvido

Entrar

(Resolvido) Bloqueio de TextArea após x caracteres

Pergunta

KiTTo

Link para o comentário

Compartilhar em outros sites

7 respostass a esta questão

Posts Recomendados

Jonathan Queiroz

Link para o comentário

Compartilhar em outros sites

KiTTo

Link para o comentário

Compartilhar em outros sites

Jonathan Queiroz

Link para o comentário

Compartilhar em outros sites

KiTTo

Link para o comentário

Compartilhar em outros sites

fiote

Link para o comentário

Compartilhar em outros sites

KiTTo

Link para o comentário

Compartilhar em outros sites

Jonathan Queiroz

Link para o comentário

Compartilhar em outros sites

Participe da discussão

Estatísticas dos Fóruns

Navegação

Atividades