Especificar la longitud máxima para el cuadro de texto de varias líneas

Estoy tratando de usar asp:

<asp:TextBox ID="txtInput" runat="server" TextMode="MultiLine"></asp:TextBox>

Quiero una forma de especificar la maxlengthpropiedad, pero aparentemente no hay forma posible para un multiline textbox. He estado intentando usar algo de JavaScript para el onkeypressevento:

onkeypress="return textboxMultilineMaxNumber(this,maxlength)"

function textboxMultilineMaxNumber(txt, maxLen) {
    try {
        if (txt.value.length > (maxLen - 1)) return false;
    } catch (e) { }
    return true;
}

Si bien funciona bien, el problema con esta función de JavaScript es que después de escribir caracteres no le permite eliminar y sustituir ninguno de ellos, ese comportamiento no es deseado.

¿Tiene alguna idea de qué podría cambiar en el código anterior para evitar eso o cualquier otra forma de evitarlo?

prueba este javascript:

function checkTextAreaMaxLength(textBox,e, length)
{

        var mLen = textBox["MaxLength"];
        if(null==mLen)
            mLen=length;

        var maxLength = parseInt(mLen);
        if(!checkSpecialKeys(e))
        {
         if(textBox.value.length > maxLength-1)
         {
            if(window.event)//IE
              e.returnValue = false;
            else//Firefox
                e.preventDefault();
         }
    }   
}
function checkSpecialKeys(e)
{
    if(e.keyCode !=8 && e.keyCode!=46 && e.keyCode!=37 && e.keyCode!=38 && e.keyCode!=39 && e.keyCode!=40)
        return false;
    else
        return true;
}

En el control, invocalo así:

<asp:TextBox Rows="5" Columns="80" ID="txtCommentsForSearch" MaxLength='1999' onkeyDown="checkTextAreaMaxLength(this,event,'1999');"  TextMode="multiLine" runat="server"> </asp:TextBox>

También puede usar la función checkSpecialKeys para validar la entrada en su implementación de JavaScript.

En su lugar, utilice un validador de expresiones regulares . Esto funcionará en el lado del cliente usando JavaScript, pero también cuando JavaScript está deshabilitado (ya que la verificación de longitud también se realizará en el servidor).

El siguiente ejemplo comprueba que el valor introducido tenga entre 0 y 100 caracteres:

<asp:RegularExpressionValidator runat="server" ID="valInput"
    ControlToValidate="txtInput"
    ValidationExpression="^[\s\S]{0,100}$"
    ErrorMessage="Please enter a maximum of 100 characters"
    Display="Dynamic">*</asp:RegularExpressionValidator>

Por supuesto, hay expresiones regulares más complejas que puede utilizar para adaptarse mejor a sus propósitos.

mantenlo simple. La mayoría de los navegadores modernos admiten un atributo maxlength en un área de texto (incluido IE), así que simplemente agregue ese atributo en el código subyacente. Sin JS, sin Jquery, sin herencia, código personalizado, sin problemas, sin problemas.

VB.Net:

fld_description.attributes("maxlength") = 255

C#

fld_description.Attributes["maxlength"] = 255

Enrolla tu propio:

function Count(text) 
{
    //asp.net textarea maxlength doesnt work; do it by hand
    var maxlength = 2000; //set your value here (or add a parm and pass it in)
    var object = document.getElementById(text.id)  //get your object
    if (object.value.length > maxlength) 
    {
        object.focus(); //set focus to prevent jumping
        object.value = text.value.substring(0, maxlength); //truncate the value
        object.scrollTop = object.scrollHeight; //scroll to the end to prevent jumping
        return false;
    }
    return true;
}

Llame así:

<asp:TextBox ID="foo" runat="server" Rows="3" TextMode="MultiLine" onKeyUp="javascript:Count(this);" onChange="javascript:Count(this);" ></asp:TextBox>

Las cosas han cambiado en HTML5:

ASPX:

<asp:TextBox ID="txtBox" runat="server" maxlength="2000" TextMode="MultiLine"></asp:TextBox>

C#:

if (!IsPostBack)
{
    txtBox.Attributes.Add("maxlength", txtBox.MaxLength.ToString());
}

HTML renderizado:

<textarea name="ctl00$DemoContentPlaceHolder$txtBox" id="txtBox" maxlength="2000"></textarea>

Los metadatos para Attributes:

Resumen: Obtiene la colección de atributos arbitrarios (solo para la representación) que no corresponden a las propiedades del control.

Devuelve: A System.Web.UI.AttributeCollectionde pares de nombre y valor.

Otra forma de arreglar esto para aquellos navegadores (Firefox, Chrome, Safari) que admiten maxlength en áreas de texto (HTML5) sin javascript es derivar una subclase de la clase System.Web.UI.WebControls.TextBox y anular el método Render. Luego, en el método anulado, agregue el atributo maxlength antes de renderizar como normal.

protected override void Render(HtmlTextWriter writer)
{
    if (this.TextMode == TextBoxMode.MultiLine
        && this.MaxLength > 0)
    {
        writer.AddAttribute(HtmlTextWriterAttribute.Maxlength, this.MaxLength.ToString());
    }

    base.Render(writer);
}

utilizar el atributo personalizado maxsize = "100"

<asp:TextBox ID="txtAddress" runat="server"  maxsize="100"
      Columns="17" Rows="4" TextMode="MultiLine"></asp:TextBox>
   <script>
       $("textarea[maxsize]").each(function () {
         $(this).attr('maxlength', $(this).attr('maxsize'));
         $(this).removeAttr('maxsize'); 
       });
   </script>

esto se renderizará así

<textarea name="ctl00$BodyContentPlac
eHolder$txtAddress" rows="4" cols="17" id="txtAddress" maxlength="100"></textarea>

$('#txtInput').attr('maxLength', 100);

Utilice HTML textarea con runat="server"para acceder a él en el lado del servidor. Esta solución tiene menos problemas que usar javascript o regex.

<textarea runat="server" id="txt1" maxlength="100" />

Nota: Para acceder a la Textpropiedad en el lado del servidor, debe usar en txt1.Valuelugar detxt1.Text

Probé diferentes enfoques, pero cada uno tenía algunos puntos débiles (es decir, con cortar y pegar o compatibilidad con el navegador). Esta es la solución que estoy usando en este momento:

function multilineTextBoxKeyUp(textBox, e, maxLength) {
    if (!checkSpecialKeys(e)) {
        var length = parseInt(maxLength);
        if (textBox.value.length > length) {
            textBox.value = textBox.value.substring(0, maxLength);
        }
    }
}

function multilineTextBoxKeyDown(textBox, e, maxLength) {
    var selectedText = document.selection.createRange().text;
    if (!checkSpecialKeys(e) && !e.ctrlKey && selectedText.length == 0) {
        var length = parseInt(maxLength);
        if (textBox.value.length > length - 1) {
            if (e.preventDefault) {
                e.preventDefault();
            }
            else {
                e.returnValue = false;
            }
        }
    }
}

function checkSpecialKeys(e) {
    if (e.keyCode != 8 && e.keyCode != 9 && e.keyCode != 33 && e.keyCode != 34 && e.keyCode != 35 && e.keyCode != 36 && e.keyCode != 37 && e.keyCode != 38 && e.keyCode != 39 && e.keyCode != 40) {
        return false;
    } else {
        return true;
    }
}

En este caso, estoy llamando a multilineTextBoxKeyUp en key up y multilineTextBoxKeyDown en key down:

myTextBox.Attributes.Add("onkeyDown", "multilineTextBoxKeyDown(this, event, '" + maxLength + "');");
myTextBox.Attributes.Add("onkeyUp", "multilineTextBoxKeyUp(this, event, '" + maxLength + "');");

Eche un vistazo a esto . La única forma de resolverlo es mediante javascript, como lo intentaste.

EDITAR: intente cambiar el evento a pulsación de tecla.

Así es como lo hicimos (mantiene todo el código en un solo lugar):

<asp:TextBox ID="TextBox1" runat="server" TextMode="MultiLine"/>
<% TextBox1.Attributes["maxlength"] = "1000"; %>

Por si acaso alguien todavía usa formularios web en 2018 ...

El siguiente ejemplo en JavaScript / Jquery hará eso-

<telerik:RadScriptBlock ID="RadScriptBlock1" runat="server">
<script type="text/javascript">
     function count(text, event) {

         var keyCode = event.keyCode;

         //THIS IS FOR CONTROL KEY
         var ctrlDown = event.ctrlKey;

         var maxlength = $("#<%=txtMEDaiSSOWebAddress1.ClientID%>").val().length;

         if (maxlength < 200) {
             event.returnValue = true;
         }
         else {

             if ((keyCode == 8) || (keyCode == 9) || (keyCode == 46) || (keyCode == 33) || (keyCode == 27) || (keyCode == 145) || (keyCode == 19) || (keyCode == 34) || (keyCode == 37) || (keyCode == 39) || (keyCode == 16) || (keyCode == 18) ||
                 (keyCode == 38) || (keyCode == 40) || (keyCode == 35) || (keyCode == 36) || (ctrlDown && keyCode == 88) || (ctrlDown && keyCode == 65) || (ctrlDown && keyCode == 67) || (ctrlDown && keyCode == 86)) 

                  {
                 event.returnValue = true;
                  }

             else {

                 event.returnValue = false;
             }
         }

     }

     function substr(text)
      {
          var txtWebAdd = $("#<%=txtMEDaiSSOWebAddress1.ClientID%>").val();
          var substrWebAdd;
          if (txtWebAdd.length > 200) 
          {                 
              substrWebAdd = txtWebAdd.substring(0, 200);                                  
              $("#<%=txtMEDaiSSOWebAddress1.ClientID%>").val('');
              $("#<%=txtMEDaiSSOWebAddress1.ClientID%>").val(substrWebAdd); 

          }
     }                  

Este fragmento funcionó en mi caso. Estaba buscando la solución y pensé en escribir esto para que pueda ayudar a cualquier futuro lector.

ÁSPID

<asp:TextBox ID="tbName" runat="server" MaxLength="250" TextMode="MultiLine" onkeyUp="return CheckMaxCount(this,event,250);"></asp:TextBox>

Java Script

function CheckMaxCount(txtBox,e, maxLength)
{
    if(txtBox)
    {  
        if(txtBox.value.length > maxLength)
        {
            txtBox.value = txtBox.value.substring(0, maxLength);
        }
        if(!checkSpecialKeys(e))
        {
            return ( txtBox.value.length <= maxLength)
        }
    }
}

function checkSpecialKeys(e)
{
    if(e.keyCode !=8 && e.keyCode!=46 && e.keyCode!=37 && e.keyCode!=38 && e.keyCode!=39 && e.keyCode!=40)
        return false;
    else
        return true;
}

@ Raúl Roa La respuesta me funcionó en caso de copiar / pegar. mientras esto lo hace.

$("textarea[maxlength]").on("keydown paste", function (evt) {
            if ($(this).val().length > $(this).prop("maxlength")) {
                if (evt.type == "paste") {
                    $(this).val($(this).val().substr(0, $(this).prop("maxlength")));
                } else {
                    if ([8, 37, 38, 39, 40, 46].indexOf(evt.keyCode) == -1) {
                        evt.returnValue = false;
                        evt.preventDefault();
                    }
                }
            }
        });

puede especificar la longitud máxima para el cuadro de texto de varias líneas en pageLoad Javascript Event

function pageLoad(){
                     $("[id$='txtInput']").attr("maxlength","10");
                    }

He establecido la propiedad de longitud máxima del cuadro de texto multilínea txtInput en 10 caracteres en la función pageLoad () Javascript

Esta es la misma que la respuesta de @ KeithK, pero con algunos detalles más. Primero, cree un nuevo control basado en TextBox.

using System.Web.UI;
using System.Web.UI.WebControls;

namespace MyProject
{
    public class LimitedMultiLineTextBox : System.Web.UI.WebControls.TextBox
    {
        protected override void Render(HtmlTextWriter writer)
        {
            this.TextMode = TextBoxMode.MultiLine;

            if (this.MaxLength > 0)
            {
                writer.AddAttribute(HtmlTextWriterAttribute.Maxlength, this.MaxLength.ToString());
            }

            base.Render(writer);
        }
    }
}  

Tenga en cuenta que el código anterior siempre establece el modo de texto en multilínea.

Para usar esto, debe registrarlo en la página aspx. Esto es necesario porque deberá hacer referencia a él mediante el TagPrefix; de lo contrario, la compilación se quejará de los controles genéricos personalizados.

<%@ Register Assembly="MyProject" Namespace="MyProject" TagPrefix="mp" %>

<mp:LimitedMultiLineTextBox runat="server" Rows="3" ...

Casi todos los navegadores modernos ahora admiten el uso del atributo maxlength para elementos textarea. (https://caniuse.com/#feat=maxlength)

Para incluir el atributo maxlength en un TextBox de varias líneas, simplemente puede modificar la colección de Atributos en el código subyacente así:

txtTextBox.Attributes["maxlength"] = "100";

Si no desea tener que usar el código subyacente para especificar eso, puede crear un control personalizado que se derive de TextBox:

public class Textarea : TextBox
{
    public override TextBoxMode TextMode
    {
        get { return TextBoxMode.MultiLine; }
        set { }
    }

    protected override void OnPreRender(EventArgs e)
    {
        if (TextMode == TextBoxMode.MultiLine && MaxLength != 0)
        {
            Attributes["maxlength"] = MaxLength.ToString();
        }

        base.OnPreRender(e);
    }
}

MaxLength ahora es compatible a partir de .NET 4.7.2, por lo que siempre que actualice su proyecto a .NET 4.7.2 o superior, funcionará automáticamente.

Puede ver esto en las notas de la versión aquí , específicamente:

Permita que los desarrolladores de ASP.NET especifiquen el atributo MaxLength para asp multilínea: TextBox. [449020, System.Web.dll, error]