[Webinar] Streamline your web hosting managementRegister Today

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 770
  • Last Modified:

character count as I am typing into an input textbox

character count as I am typing into an input textbox
0
rgb192
Asked:
rgb192
1 Solution
 
BadotzCommented:
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;
}
</script>
...
<body>
<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>
...
</body>

Open in new window

0
The new generation of project management tools

With monday.com’s project management tool, you can see what everyone on your team is working in a single glance. Its intuitive dashboards are customizable, so you can create systems that work for you.

 
Marco GasiFreelancerCommented:
Try this, is tested.

Bye
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
  <meta http-equiv="content-type" content="text/html; charset=windows-1250">
  <meta name="generator" content="PSPad editor, www.pspad.com">
  <title></title>
  <script>
    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;
    }
</script>
</head>
  <body>
    <form name='test' action='test.html' method='post'>
    <input type="text" id="testtext" name="testtext" onkeyup="countChars();">
    </form>
    <table>
    <tr>
    <td id='dest'></td>
    </tr>
    </table>
  </body>
</html>

Open in new window

0
 
Marco GasiFreelancerCommented:
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.

Bye
0
 
Michel PlungjanIT ExpertCommented:
or

window.onload=function() {
 countChars();
    }

0
 
Marco GasiFreelancerCommented:
Still need you assistance with this?
0
 
rgb192Author Commented:
thanks
0

Featured Post

Never miss a deadline with monday.com

The revolutionary project management tool is here!   Plan visually with a single glance and make sure your projects get done.

Tackle projects and never again get stuck behind a technical roadblock.
Join Now