character count as I am typing into an input textbox

Posted on 2010-08-12
Last Modified: 2012-05-10
character count as I am typing into an input textbox
Question by:rgb192
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
LVL 29

Expert Comment

ID: 33423815
Something along these lines (untested, sorry):

<script type="text/javascript">

function io_count(src, tgt) {
    if (src.nodeName && src.nodeName === "INPUT") {
        if (typeof tgt === "string") {
            tgt = document.getElementById(tgt);
        tgt.value = src.length;
        return false;
    return true;
<input id="txt_test1" onchange="return io_count(this, 'div_test1');" value="" />
<div id="div_test1"></div>
<input id="txt_test2" onchange="return io_count(this, 'div_test2');" value="" />
<div id="div_test2"></div>

Open in new window

[Live Webinar] The Cloud Skills Gap

As Cloud technologies come of age, business leaders grapple with the impact it has on their team's skills and the gap associated with the use of a cloud platform.

Join experts from 451 Research and Concerto Cloud Services on July 27th where we will examine fact and fiction.

LVL 31

Accepted Solution

Marco Gasi earned 500 total points
ID: 33424631
Try this, is tested.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
  <meta http-equiv="content-type" content="text/html; charset=windows-1250">
  <meta name="generator" content="PSPad editor,">
    function changeContent(){
        var txt = document.getElementById('testtext').value;
        document.getElementById('dest').innerHTML = txt;
    function countChars(){
        var len = document.getElementById('testtext').value.length;
        document.getElementById('dest').innerHTML = len;
    <form name='test' action='test.html' method='post'>
    <input type="text" id="testtext" name="testtext" onkeyup="countChars();">
    <td id='dest'></td>

Open in new window

LVL 31

Expert Comment

by:Marco Gasi
ID: 33424772
Sorry, I forgot a little trick. Add this function within <script> tags:

    function emptyText(){
      document.getElementById('testtext').value = '';  

and add this to the <body tag:

<body onload="emptyText();">

This ensure that refreshing the page the text box is empty and the count begin from 0.

LVL 75

Expert Comment

by:Michel Plungjan
ID: 33429739

window.onload=function() {

LVL 31

Expert Comment

by:Marco Gasi
ID: 33436637
Still need you assistance with this?

Author Closing Comment

ID: 33436803

Featured Post

Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

This article discusses how to create an extensible mechanism for linked drop downs.
Originally, this post was published on Monitis Blog, you can check it here . In business circles, we sometimes hear that today is the “age of the customer.” And so it is. Thanks to the enormous advances over the past few years in consumer techno…
The viewer will learn how to create and use a small PHP class to apply a watermark to an image. This video shows the viewer the setup for the PHP watermark as well as important coding language. Continue to Part 2 to learn the core code used in creat…
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

628 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question