Click here to Skip to main content
15,850,265 members
Please Sign up or sign in to vote.
4.00/5 (1 vote)
See more:
Hi all,
I have a asp text box and a label to display the count of characters as so:
XML
<asp:TextBox ID="txtSignature" runat="server" TextMode = "MultiLine"
                   MaxLength="160" ></asp:TextBox>   <asp:Label ID="lblCharacters" runat="server"></asp:Label>


i have put in Jscript functions to display the count:
XML
<script  language ="javascript" type="text/javascript">
    function DisplayCount() {
        var length = document.getElementByID('<%= txtSignature.ClientID %>').value.length;
        document.getElementByID('<%= lblCharacters %>').value = length;
        alert(length);
    }
</script>


The page load event has the following code:
txtSignature .Attributes.Add("javascript:onkeydown();",  "javascript:return DisplayCount();");
txtSignature.Attributes.Add("javascript:onkeypress();", "javascript:return DisplayCount();");

I still cant see teh count on teh label when i type in the textbox. Any one knows what the prob might be?
Thanks.
Posted
Updated 30-May-11 22:27pm
v2

Just replace your javascript code with this.
<script language="javascript" type="text/javascript">
    function DisplayCount() {
        var length = document.getElementById('<%=txtSignature.ClientID%>').value.length;
        document.getElementById('<%=lblCharacters.ClientID%>').innerText = length;
        alert(length);
    }
    </script>

1) Replace D with d in document.getElementByID. It should be document.getElementById
2) For label you have to use innerText to set the value.

And in page load also change the code like this.
txtSignature.Attributes.Add("onkeypress", "javascript:return DisplayCount();");

Only keypress or keydown is enough.
 
Share this answer
 
v3
Comments
AnnSJ 31-May-11 3:52am    
i got 2 comments telling me to do the same thng n its still not working..
the thing is i dont even get InnerText as property in the intellisense. could there be anything wrong with my settings
Toniyo Jackson 31-May-11 3:54am    
You will not get innerText in intellisense. You just replace your code with my code. It should work.
Toniyo Jackson 31-May-11 4:04am    
see my updated answer
Nickos_me 31-May-11 4:27am    
Toniyo, thank you! It was my problem too.

But your solution doest't works in FF 4 and I don't know why. And real length is your length+1.
For author - as I remember, MaxLength have no sense when you use TextMode Multiline.
AnnSJ 31-May-11 4:27am    
yeah that is what was missing.. now it works.. thanks a million :)
XML
document.getElementByID('<%= lblCharacters %>').innerHTML = length;
document.getElementByID('<%= lblCharacters %>').innertext = length;
 
Share this answer
 
Comments
AnnSJ 31-May-11 3:36am    
HI ,
i have tried using both ..it does not work.
when i try to check what properties are available after document.getElementByID('<%= lblCharacters %>'). , innerHTMl and innerText do not even appear.
Sergey Alexandrovich Kryukov 31-May-11 18:39pm    
You reproduce OP's spelling error, please see my answer.
--SA
I can see at least one bug: must be document.getElementById (capitalization). Code is case-sensitive, you know…

—SA
 
Share this answer
 
Comments
AnnSJ 31-May-11 3:38am    
thanks. changed it... but still my label is not showing the count
Sergey Alexandrovich Kryukov 31-May-11 18:44pm    
I tested on DIV with innterHTML -- it works. For a label, it innerHTML should work, too.
--SA
Hi Why don't you use JQuery, Its a handy tach in Web.

I just add the following code in the page and it is working, no need to register keydown events in server side.

Just add the reference to the jquery file and get the result.

XML
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script src="Scripts/jquery-1.4.1.min.js" type="text/javascript"></script>
    <script type="text/javascript">

        $(document).ready(function () {
            $('#txtCount').keydown(function () {
                $('#lblCount').html($(this).val().length + 1);
            });
        });


    </script>
</head>

<body>
    <form id="form1" runat="server">
    <div>
        <table>
            <tr>
                <td>
                <asp:TextBox ID="txtCount" runat="server" ></asp:TextBox>
                <asp:Label ID="lblCount" runat="server"></asp:Label>
                </td>
            </tr>
        </table>
    </div>
    </form>
</body>
</html>
 
Share this answer
 
v2

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900