在asp.net中计数错误的文本框字符

Question

I keep getting the error 0x800a1391 - JavaScript runtime error: 'txtMessage' is undefined what I am trying to do is to count the characters of a textbox

<script type="text/javascript">
    function textCounter(field, countfield, maxlimit)
    { 
        if (field.value.length > maxlimit)    
          field.value = field.value.substring(0, maxlimit);
        else
          countfield.value = maxlimit - field.value.length;
    }
</script>

Textbox that I have :

<asp:TextBox ID="txtMessage" TextMode="MultiLine"  Width="200px" Rows="3" runat="server"  onkeyup="textCounter(txtMessage, this.form.remLen, 160);" onkeydown="textCounter(txtMessage, this.form.remLen, 160);" />

and here I am counting:

<input readonly="readonly" type="text" name="remLen" size="3" maxlength="3" value="160" /> characters left

Answer 1

You are referring to a server side control. In my situations, the ID specified on the server will not be the same as the ID on the client. You can correct that in a number of ways. The most straight forward is to change the ClientIDMode.

<asp:TextBox ID="txtMessage" ClientIdMode="static" TextMode="MultiLine"  Width="200px" Rows="3" runat="server"  onkeyup="textCounter(txtMessage, this.form.remLen, 160);" onkeydown="textCounter(txtMessage, this.form.remLen, 160);" />

Changing the mode to static will mean that it will use the ID that you specified. Beware that you're now responsible for ensuring the ID is unique on the composited page (master page(s) + content page + user control(s)).

When dealing with JavaScript, always inspect the source using your browser. What you're looking at on the server may be different than what you get on the client.

Answer 2

If you use script on client side, use javascript for access to controls. Try follows:

<asp:TextBox ID="txtMessage" TextMode="MultiLine" runat="server"  Width="200px" Rows="3"  onkeyup="textCounter(this.value, 160);" onkeydown="textCounter(this.value, 160);" />
<input id='remLen' readonly="readonly" type="text" name="remLen" size="3" maxlength="3" value="160" /> characters left

And correct your script:

<script type="text/javascript">
function textCounter(value, maxlimit)
{ 
if (value.length > maxlimit)    
    value = value.substring(0, maxlimit);
else
    var countfield = document.getElementById('remLen');
    countfield.value = maxlimit - field.value.length;
}
</script>