none
Limitar caracteres num textbox

    Question

  • Olá a todos,

    bem, estou precisando de uma função javascript para limitar a quantidade de caracteres que o usuário pode digitar, preciso que fique aparecendo uma frase informando "Restam ainda XX caracteres". Tentei utilizar o seguinte codigo, mais não funcionou.

    ASPX:

    <label class="colUm">Areas de Interesse:<br />    
                    <asp:TextBox ID="tbAreasInteresse" onkeyup="LimitarCaracter(this, ContaCaractere,'200');" runat="server" CssClass="text"                  TextMode="MultiLine" Height="50px" CausesValidation="True"></asp:TextBox><br />
                    <span style="font-size: 10pt">Restam ainda <span id="ContaCaractere" style="font-size: 85%;"><strong>200</strong></span> caracteres.</span>
    </label>


    JavaScript

    function LimitarCaracter(idCampo, idContador, TamMax)
    {
    Caracteres = TamMax - document.getElementById(idCampo).value.length;
    document.getElementById(idContador).innerHTML = Caracteres;
    if(document.getElementById(idCampo).value.length >= TamMax)
    {
    document.getElementById(idCampo).value = document.getElementById(idCampo).value.substring(0, TamMax);
    document.getElementById(idContador).innerHTML = "0";
    }
    }

    C#

     protected void Page_Load(object sender, EventArgs e)
        {
            tbAreasInteresse.Attributes.Add("onkeyup=", "LimitarCaracter(this, ContaCaractere,'200')");


    Obrigado!

    Friday, July 31, 2009 7:06 PM

Answers

All replies

  • Olá Junior, tudo bem ?

    De fato quando você coloca o atributo TextMode para Multline, o asp.net irá renderizar para você um TextArea, diferente do Input Type="text", este controle não tem a propriedade maxlenght e voc~e precisa trabalhar com javascript, minha sugestão é:

    <script language="javascript">
     	function maxLength(textAreaField, limit) {
     		var ta = document.getElementById(textAreaField);
     		
     		if (ta.value.length >= limit) {
     			ta.value = ta.value.substring(0, limit-1);
     		}
     	}
     </script>


    E aplique ao TextBox (do asp.net):

    <asp:TextBox ID="txtExemplo" runat="server" onKeyDown="maxLength('txtExemplo', 200);" TextMode="MultiLine" />
    Ou caso esteja em runtime:

    txtExemplo.Attributes["onkeydown"] = "maxLength('" + txtExemplo.ClientID + "', 200);"

    Espero que ajude
    um abraço
    att,


    Felipe Oriani - www.felipeoriani.com.br

    ...O rio atinge os seu objetivos porque aprendeu a contornas os obstáculos... por André Luiz
    Friday, July 31, 2009 7:29 PM
  • Ola,

    Para limitar o tamanho você pode setar a propriedade maxlenght do controle.

    E fiz um javascript rápido para você ver:

    <html>
    <head>
    	<script type="text/javascript" language="javascript">
    		function limita(e, max){
    			var t = e.value.length;			
    			var restam = max - t;
    			
    			escreve(restam);
    		}
    		
    		function escreve(msg){
    			document.getElementById("cont").innerHTML = '<font color="#9F1414"><b>Restam ainda '+msg+' caracteres!</b></font>';
    
    		}
    	</script>
    </head>
    <body>
    	<input id="txtNome" onkeyup="javascript:limita(this, 5)" />
    	<br />
    	<input id="txt" />
    	<div id="cont"></div>
    </body>
    </html>


    Atenciosamente


    Se a resposta for útil marque como tal
    Thiago Dorneles
    Friday, July 31, 2009 7:32 PM
  • Olá Felipe, estou bem e vc?

    entendi sua sugestão, mas ainda não funcionou, fica dando uma mensagem Attribute onKeyDown is not a valid attribute of element 'Textbox'. Outra coisa, é que seria interessante se a frase "Restam ainda XX caracteres" aparecesse
    Friday, July 31, 2009 8:58 PM
  • Olá Thiago,

    Testei seu exemplo e funcionou certinho, mas preciso desta funcionalidade em um textbox multiline e quando eu coloco Onkeyup dentro do asp textbox ele diz que Attribute Onkeyup is not a valid attribute of element 'Textbox', vc saberia como fazer funcionar no asp textbox? Também precisava que quando o limite de caracteres fosse atingido a digitação travasse.


    Muito obrigado!
    Friday, July 31, 2009 9:26 PM


  • Olá Pessoal,


    Veja se ajudam:


    Limitar qtde de caracter no TextBox
    http://forum.imasters.uol.com.br/index.php?/topic/273065-limitar-qtde-de-caracter-no-textbox/


    Limitar número de caracteres em TextBox Multiline

    http://filpamplona.spaces.live.com/blog/cns!632A6AB65689742!266.entry


    TextBox: Somente numero inteiro, e limite de 2 caracteres.
    http://social.msdn.microsoft.com/Forums/pt-BR/aspnetpt/thread/137721e7-1477-4eda-a8f6-b5331f042375


    Text Box Multiline com limite caracteres por linha
    http://social.msdn.microsoft.com/Forums/pt-BR/vscsharppt/thread/3cdea5bf-4743-4bdb-aa45-efb2de3efaec


    Abraço,


    Magno Machado Borba |- Se o post foi util ou resposta nao esqueca de marcar.
    Friday, July 31, 2009 10:31 PM
  • Oi,

    Neste trecho :

    ="LimitarCaracter(this, ContaCaractere,'200');"

    Tire os apóstrofos do 200 :

    ="LimitarCaracter(this, ContaCaractere,200);"

    []'s
    Dennes

    Treinamento : Fundamentos de OO e Framework .NET c/ C# - 10/08
    Veja o conteúdo e se inscreva em http://www.bufaloinfo.com.br/cursos/fundamentosOOFramework.asp

    Treinamento : ASP.NET Avançado - 24/08
    Veja o conteúdo e se inscreva em http://www.bufaloinfo.com.br/cursos/aspnet2avancado.asp


    Dennes - Se resolveu, classifique a mensagem, por favor - [http://www.bufaloinfo.com.br] NOVO DVD Segurança no ASP.NET : http://www.bufaloinfo.com.br/LearingSeriesSegurancaASPNET2.asp
    Saturday, August 01, 2009 6:45 PM
  • F, Junior,

    Dá uma olhada neste post em meu blog que irá te ajudar:
    http://www.danielgarcia.com.br/post/Limitando-a-Quantidade-de-Caracteres-Digitados-em-um-TextBox-do-tipo-MultiLine.aspx

    Espero ter ajudado. Caso consiga solucionar o problema em função desta resposta, peço por favor, clicar em “Marcar como Resposta” para que outras pessoas também possam usufruir deste conteúdo.

    Abraço.
    Daniel Garcia
    MCP, MCTS, MCDP
    Meu blog: www.danielgarcia.com.br

    • Proposed as answer by Harley AraujoOwner Monday, August 03, 2009 1:28 PM
    • Marked as answer by F. Junior Monday, August 03, 2009 1:55 PM
    Sunday, August 02, 2009 1:06 AM
  • Olá Daniel, era isso mesmo que eu precisa, funcionou perfeitamente.

    Muito obrigado pela ajuda e grande abraço!

    Parabéns pelo seu site.

    Att,

    F. Junior.
    Monday, August 03, 2009 1:56 PM