Как изменить видимость метки asp с помощью javascript с событием onchange текстового поля asp

Question

Я использовал css, чтобы установить отображение метки на none Я очень плохо знаком с JS, поэтому я не на 100% на мой код для этого ..

<script type="text/javascript">
function strLen(field, count)
{
var str = document.getElementById("textbox1");
if(str.value.length > 2)
{
document.getElementById("errorLabel").style.display = 'inherit';
}
}
</script>
<asp:textbox id="textbox1" CssClass="style5" runat="server" MaxLength="10"         onchange="strLen()"></asp:textbox>

Answer 1

У вас есть аргументы в вашей функции JS, но вы не передаете никаких аргументов в событии onchange.

Примените следующий код к вашему TextBox:

<asp:TextBox ID="textbox1" CssClass="style5" runat="server" MaxLength="10" onkeyup="strLen(this, 2);"></asp:TextBox>

МЕТОД # 1 : Использование метки

Ваша метка ошибки должна выглядеть следующим образом:

<asp:Label ID="lblError" runat="server" Text="Exceeds max length" style="display:none;"></asp:Label>

И затем в вашей функции JavaScript вы можете сделать это:

EDIT : Логика была обратной - изменена на: input.value.length> count?"block": "none";

strLen = function(input, count){
    var errorLabel = document.getElementById("<%=lblError.ClientID%>");
    if (errorLabel)
        errorLabel.style.display = input.value.length > count ? "block" : "none";
}

METHOD # 2 : Использование диапазона вместо метки

Или вы можете просто использовать диапазон вместометка, как это:

<span id="errorLabel" style="display:none;">Exceeds max length</span>

И измените функцию JavaScript на это:

EDIT : имел логику в обратном направлении - изменен на: input.value.length> count?"блок": "нет";

strLen = function(input, count){
    var errorLabel = document.getElementById("errorLabel");
    if (errorLabel)
        errorLabel.style.display = input.value.length > count ? "block" : "none";
}

Answer 2

Если вы используете asp.net 4, то вы можете установить ClientIdMode метки в static и ссылаться на него, как вы.См. Сообщение Рика здесь: http://www.west -wind.com / weblog / posts / 2009 / Nov / 07 / ClientIDMode-in-ASPNET-40

Вы можете использовать RegularExpressionValidator для проверкидлина текстового поля ... однако на основе вашего комментария см. ниже решение javascript.

http://forums.asp.net/t/1026502.aspx

чистый javascript - что-то вроде этого должно работать нормально .:

 <div id="lengthInfo" style="display:none">Too long!!</div>
 <script type="text/javascript">
     function strLen(textBox) {
         var str = textBox.value;
         if (str.length > 2) {
             document.getElementById("lengthInfo").style.display = &#39;inline&#39;;
         }
         else {
             document.getElementById("lengthInfo").style.display = &#39;none&#39;;
         }
     }
</script>
<asp:textbox id="textbox1" CssClass="style5" ClientIDMode="Static" runat="server" MaxLength="10" onkeyup="strLen(this)"></asp:textbox>