Click here to Skip to main content
15,609,235 members
Articles / Web Development / HTML
Posted 7 Sep 2006


14 bookmarked

Javascript based Word Counter for text entered in a Text area, works for poastback also.

Rate me:
Please Sign up or sign in to vote.
1.33/5 (2 votes)
7 Sep 20061 min read
Gives an idea about counting words entred in a text area, this will works fine whenever postback occurs also, implemented in javascript and codebehind(small portion).


This article gives an idea about how to implement count of the words entered in a text area and stores the value of the count in an hidden variable and used whenever postbak occurs.

The javasript method wordcounter() will be called from textarea's onkeypress and onkeydown events. For postback events this method will be called from body's onload event.

The lines of javascript code written are given below.

function wordCounter(chkBodyLoad)


 if(chkBodyLoad == 0)


        var wordcounter=0;

        var textField = event.srcElement;

// Counts the spaces and new line characters while ignoring double spaces, usually one in between each word.

        for (x=0; x < textField.value.length; x++)


        if ((textField.value.charAt(x) == " " && textField.value.charAt(x-1) != " ")||textField.value.charAt(x) == "\n" && textField.value.charAt(x-1) != "\n"))


                        wordcounter = wordcounter + 1;



        document.forms[0].hidWordCount.value = wordcounter;

        spnWordCount.innerText = wordcounter;


    else if(chkBodyLoad == 1) 

        spnWordCount.innerText = document.forms[0].hidWordCount.value ;



"hidWordCount" is used for storing the word count whenever the page is submitted.

<form id=frmWordCounter runat="server">

And the method calls are given below,


method call from body is onload="wordCounter(1);"



This article has no explicit license attached to it but may contain usage terms in the article text or the download files themselves. If in doubt please contact the author via the discussion board below.

A list of licenses authors might use can be found here

Written By
Web Developer
United States United States
This member has not yet provided a Biography. Assume it's interesting and varied, and probably something to do with programming.

Comments and Discussions

GeneralYour source code zip file is missing Pin
MeDeeSa14-Sep-06 4:20
MeDeeSa14-Sep-06 4:20 
Generalone liner with different regex than mzeo77 [modified] Pin
Derek Read11-Sep-06 14:19
Derek Read11-Sep-06 14:19 
Here's a one liner that should give you an accurate word count for a string, assuming what I think of as being a "word" is the same as you, see "what it does" below...

wordcount = someStringVariable.replace(/\S+/g, 'a').replace(/\s+/g, '').length;

For a form you would get the value from the form's control and stick it into "someStringVariable", similar to this:
wordcount = document.formname1.textarea1.value.replace(/\S+/g, 'a').replace(/\s+/g, '').length;

What it Does:
- Replaces every contiguous group of whitespace characters with a null string (nothing).
- Replaces every contiguous group of non-whitespace characters (a word) with the letter "a" (could be anything).
- Counts how many characters are left in the string (the number of "a" characters).

Also, I think it is better to use the onkeyup event because you will get a better count. onkeyup allows the characters typed to be input into the form *and then* calls the function. Particularly noticeable if you hold a key down. If you use onkeydown or onkeypress then the function is run *before* the character is input into the form, giving you an incorrect count (ie: up to one word fewer than are actually there from the user's point of view).

-- modified at 13:06 Tuesday 12th September, 2006

Derek Read

GeneralWithout the loop Pin
mzeo777-Sep-06 22:24
mzeo777-Sep-06 22:24 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Praise Praise    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.