Указание максимальной длины для многострочного текстового поля

Question

Я пытаюсь использовать asp:

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

Я хочу указать свойство maxlength, но, очевидно, для multiline textbox это невозможно. Я пытался использовать JavaScript для события onkeypress:

onkeypress="return textboxMultilineMaxNumber(this,maxlength)"

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

Во время работы нормально проблема с этой функцией JavaScript в том, что после написания символов она не позволяет вам удалять и заменять какие-либо из них, такое поведение нежелательно.

У вас есть идея, что я мог бы изменить в приведенном выше коде, чтобы избежать этого или каких-либо других способов обойти это?

Answer 1

Используйте взамен валидатор регулярных выражений . Это будет работать на стороне клиента, используя JavaScript, но также и когда JavaScript отключен (так как проверка длины будет также выполняться на сервере).

В следующем примере проверяется, что введенное значение имеет длину от 0 до 100 символов:

<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>

Конечно, есть более сложные регулярные выражения, которые вы можете использовать, чтобы лучше соответствовать вашим целям.

Answer 2

попробуйте этот 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;
}

На элементе управления вызовите его так:

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

Вы также можете просто использовать функцию checkSpecialKeys для проверки ввода в вашей реализации JavaScript.

Answer 3

будь проще. Большинство современных браузеров поддерживают атрибут maxlength в текстовой области (включая IE), поэтому просто добавьте этот атрибут в выделенный код. Нет JS, нет Jquery, нет наследования, пользовательский код, нет суеты, нет беспорядка.

VB.Net:

fld_description.attributes("maxlength") = 255

C #

fld_description.attributes["maxlength"] = 255

Answer 4

Сверните свои собственные:

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;
}

Звоните так:

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

Answer 5

использовать пользовательский атрибут 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>

это будет выглядеть так

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

Answer 6

Еще один способ исправить это для тех браузеров (Firefox, Chrome, Safari), которые поддерживают maxlength для текстовых областей (HTML5) без javascript, - это извлечь подкласс класса System.Web.UI.WebControls.TextBox и переопределить метод Render. , Затем в переопределенном методе добавьте атрибут maxlength перед рендерингом в обычном режиме.

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

    base.Render(writer);
}

Answer 7

В 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:

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

---

Метаданные для Attributes:

Сводка. Получает коллекцию произвольных атрибутов (только для рендеринга), которые не соответствуют свойствам элемента управления.

Возвращает: A System.Web.UI.AttributeCollection пар имя и значение.

Answer 8

Я пробовал разные подходы, но у каждого были свои слабые стороны (то есть с совместимостью «вырезать и вставить» или с браузером). Это решение, которое я использую сейчас:

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;
    }
}

В этом случае я вызываю multilineTextBoxKeyUp при ключе вверх и multilineTextBoxKeyDown при нажатии клавиши вниз:

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

Answer 9

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

Answer 10

Посмотрите на это . Единственный способ решить эту проблему - с помощью javascript, как вы пытались.

EDIT: Попробуйте изменить событие на нажатие клавиш.