ASP.Net - Contagem de Caracteres e a Validação do Comprimento máximo
Neste artigo vou explicar como implementar Contagem de Caracteres e a Validação do Comprimento máximo de caracteres para os TextBox e o controle HTML TextArea. O controle HTML TextArea não tem a propriedade MaxLength como o TextBox normal e campos do tipo Password possuem, mas podemos usar o plugin jQuery MaxLength que simula o funcionamento do MaxLength normal com a ajuda de JavaScript e jQuery.
Então vamos a implementação do Plugin jQuery MaxLength para ASP.Net TextBox (TextArea), abaixo, você vai notar a implementação do plugin MaxLength jQuery. O plugin MaxLength jQuery tem os seguintes parâmetros obrigatórios e opcionais:
1. MaxLength (obrigatório) - valor inteiro indicando o limite de comprimento máximo de caracteres.
2. CharacterCountControl (opcional) - Por padrão, o plugin irá exibir a contagem de caráter abaixo do TextArea, mas o usuário tem a opção de especificar explicitamente o controle de contagem dos caracteres.
Lembrando que o controle de contagem de caracteres só pode ser usado com a tag HTML SPAN ou DIV.
3. DisplayCharacterCount (opcional) - Padrão True. Se escolhida para false a contagem de caracteres será desativada.
<html xmlns="http://www.w3.org/1999/xhtml"><head runat="server"><title>title><script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js">script><script type="text/javascript" src="MaxLength.min.js">script><script type="text/javascript">$(function () {//Normal Configuration$("[id=TextBox1]").MaxLength({ MaxLength: 10 });//Specifying the Character Count control explicitly$("[id=TextBox2]").MaxLength({MaxLength: 15,CharacterCountControl: $('#counter')});//Disable Character Count$("[id*=TextBox3]").MaxLength({MaxLength: 20,DisplayCharacterCount: false});});script>head><body><form id="form1" runat="server"><div id="counter">div><asp:TextBox ID="TextBox1" runat="server" TextMode="MultiLine" Width="300" Height="100"Text="Mudassar Khan">asp:TextBox><br /><br /><asp:TextBox ID="TextBox2" runat="server" TextMode="MultiLine" Width="300" Height="100">asp:TextBox><br /><br /><asp:TextBox ID="TextBox3" runat="server" TextMode="MultiLine" Width="300" Height="100">asp:TextBox>form>body>html>
Faça o download dos arquivos aqui.
Movido para a área de tutoriais.
Discussão (1)
Carregando comentários...