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

Я пытаюсь использовать 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 заключается в том, что после записи символов она не позволяет вам удалять и заменять любую из них, это поведение нежелательно.

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

ОТВЕТЫ

Ответ 1

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

Ответ 2

Вместо этого используйте средство проверки регулярных выражений. Это будет работать на стороне клиента с использованием 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>

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

Ответ 3

Сворачивать самостоятельно:

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>

Ответ 4

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

VB.Net:

fld_description.attributes("maxlength") = 255

С#

fld_description.attributes["maxlength"] = 255

Ответ 5

Еще один способ исправить это для этих браузеров (Firefox, Chrome, Safari), поддерживающих maxlength в textareas (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);
}

Ответ 6

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

Ответ 7

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

Ответ 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 на key up и multilineTextBoxKeyDown на клавиатуре вниз:

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

Ответ 9

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

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

Ответ 10

Используйте текстовое поле HTML с runat="server" для доступа к нему на стороне сервера. Это решение имеет меньшую боль, чем использование javascript или регулярного выражения.

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

Примечание. Чтобы получить доступ к Text Свойству на стороне сервера, вы должны использовать txt1.Value вместо txt1.Text

Ответ 11

В HTML5 изменились вещи:

ASPX:

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

С#:

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 пар имен и значений.

Ответ 12

Следующий пример в JavaScript/Jquery сделает это -

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

          }
     }

Ответ 13

Этот фрагмент работал в моем случае. Я искал решение и думал написать это, чтобы он мог помочь любому будущему читателю.

ASP

<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 Ответ работал на меня в случае копирования/вставки. в то время как это происходит.

Ответ 14

$("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();
                    }
                }
            }
        });

Ответ 15

Вот как мы это сделали (хранит весь код в одном месте):

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

На всякий случай, кто-то еще использует веб-формы в 2018 году..

Ответ 16

Вы можете указать максимальную длину для многострочного текстового поля в событии pageLoad Javascript.

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

Я установил свойство максимальной длины многострочного текстового поля txtInput на 10 символов в функции JavaScript JavaScript pageLoad()

Ответ 17

Это то же самое, что и ответ @KeithK, но с некоторыми подробностями. Сначала создайте новый элемент управления на основе 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);
        }
    }
}

Обратите внимание, что код выше всегда устанавливает текстовый режим в многострочное.

Чтобы использовать это, вам нужно зарегистрировать его на странице aspx. Это необходимо, потому что вам нужно ссылаться на него с помощью TagPrefix, в противном случае компиляция будет жаловаться на пользовательские общие элементы управления.

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

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