É baste comum a situação em que, num formulário interativo de internet, alguns “efeitos” se façam necessários para melhorar a interação deste form com quem o está usando. Algumas dessas vezes é um contador (ou limitador) de caracteres digitados que é necessário. Por exemplo, você tem um campo no form que só pode admitir 250 caracteres, então, como fazer caso a pessoa digite mais do que isso?
A resposta é: jQuery MessageBox Handler!
Com MessageBox Handler é possível definir um valor máximo de caracteres que podem ser digitados em campo textarea. Caso este valor seja ultrapassado, o botão de submeter o formulário é automaticamente desabilitado, impossibilitando seu envio.
Usando jQuery MessageBox Handler
Pode parecer incrível, mas, para usar o MessageBox Handler com suas configurações deafult. Depois de fazer download, basta somente 1 linha:
$('.message-box').messageBoxHandler();
Onde “message-box” é uma div que contém o formulário.
Opções do jQuery MessageBox Handler
Na maioria das vezes, é certo que as opções que vêm por padrão não são as suficientes, pois cada formulário terá suas necessidades e especificações. Para tais casos, o plugin conta com uma série de opções:
- maxUpdateChars (140). Número máximo de caracteres permitidos.
- submitBtn (null). O botão de enviar (por padrão, pega o que está dentro do seletor escolhido.
- leftCharsCounterClass (null). Classe para a contagem de caracteres restantes.
- counterErrorClass (‘counter-error-length’). Classe para quando o limite de caracteres é ultrapassado.
- disabledClass (‘disabled’). Classe para quando o botão de enviar está desabilitado.
- emptyMessageText (”). Mensagem que aparece quando não há nada dentro da textarea (normalmente, usa-se o default).
Então, em um exemplo, se fosse preciso uma textarea (dentro de uma div de ID “especial-form”) com limite de 100 caracteres, com classe para o contador “count” e a classe de erro fosse “count-error”, teríamos o seguinte código:
$('.especial-form').messageBoxHandler({
maxUpdateChars: '100',
leftCharsCounterClas: 'count-error',
counterErrorClass: ''
});
Conclusão sobre o jQuery MessageBox Handler
Quando se tem formulários interativos em um site, certamente estes são de muita valia, tanto para validação front-end, quanto para garantir que o visitante tenha uma boa experiência dentro daquele espaço virtual.
Usando o MessaBox Handler, certamente você poderá planejar e executar mais facilmente as interações de seus formulários online.
