miércoles, 4 de julio de 2012

Contador y Limitador de Caracteres

La idea de colocar esta función a un TextArea o a un TextBox tipo multiline de ASP.NET resulta muy común cuando existe un limite de espacio en un campo de una tabla en la Base de Datos (BD), ya que en ocasiones se crean campos para párrafos, mensajes o títulos con un tamaño de caracteres 400 por ejemplo y para no desbordar este tope o para evitar que los datos se almacenen incompletos en la BD se establece un limitador de caracteres en el campo y preferiblemente en la parte del cliente. En la siguiente figura se muestra un ejemplo



Esto se puede logran con el siguiente código JavaScript:


    <script type="text/javascript" language="javascript">
         function  contadorTexto(campo, cuentaCampos, limiteMaximo)
        {
             if  (campo.value.length > limiteMaximo) //Si muy largo, cortar.
                campo.value = campo.value.substring(0, limiteMaximo);
             else
                 cuentaCampos.value = (limiteMaximo - campo.value.length);
        }
     </script>

Los dos (2) siguientes elementos son el TextBox donde se escribe el texto que se cuenta y se limita, seguido de un Input que muestra la cantidad de caracteres que faltan para llegar al limite.



<asp:TextBox ID="Txt_Mensaje" runat="server" TextMode="MultiLine" Height="80px" Width="400px" onkeydown="contadorTexto(this.form.Txt_Mensaje, this.form.Txt_Cont, 500);" onkeyup="contadorTexto(this.form.Txt_Mensaje, this.form.Txt_Cont, 500);"></asp:TextBox>

<input id="Txt_Cont" type="text" size="3" disabled="disabled">