Ad:

JavaScript / DHTML / AJAX Discussion Thread
Marked Solved
Views: 1971

Feb 20th, 2008

simple Javascript counting function

Expand Post »

Hi, i have a form on my website, and I would like to have a text box next to another text box that displays how many letters the user can type into the box eg:

html Syntax (Toggle Plain Text)
<td><input type="text" name="description" maxlength="30" /></td>
<td><input type="text" class="counter" value="30" disabled="true" /></td>
<td><input type="text" name="description" maxlength="30" /></td>
<td><input type="text" class="counter" value="30" disabled="true" /></td>

This is fine, but I would like the box with the numbers in it to count down as the user types in the first box, and if they delete something i would like the number to go back up again too.

If anyone could help me that'd be great thanks.

Similar Threads

CSS pseudo-letter ??? in HTML and CSS

hooray

Reputation Points: 11

Solved Threads: 6

Junior Poster in Training

Offline

62 posts
since Jan 2008

Permalink

Feb 20th, 2008

Re: simple Javascript counting function

use onkeydown event in text box,
in this event write a function which will take value of textbox check the length of string and then print the no. in the box......

DangerDev

Reputation Points: 165

Solved Threads: 59

Posting Pro in Training

Offline

485 posts
since Jan 2008

Permalink

Feb 20th, 2008

Re: simple Javascript counting function

Hi There,

Try This Code

JavaScript:

JavaScript / DHTML / AJAX Syntax (Toggle Plain Text)
<script type="text/javascript">
function valueChange(){
		textBox1 = document.getElementById('textBox1');
		description = document.getElementById('description');
		textBox1.value = description.value.length;
}
</script>
<script type="text/javascript">
function valueChange(){
		textBox1 = document.getElementById('textBox1');
		description = document.getElementById('description');
		textBox1.value = description.value.length;
}
</script>

HTML:

JavaScript / DHTML / AJAX Syntax (Toggle Plain Text)
<input type="text" name="description" maxlength="30" id="description" onkeyup="valueChange()" /></td>
<input type="text" class="counter" readonly="readonly" id="textBox1" />
<input type="text" name="description" maxlength="30" id="description" onkeyup="valueChange()" /></td>
<input type="text" class="counter" readonly="readonly" id="textBox1" />

Rahul Dev Katarey

Last edited by katarey; Feb 20th, 2008 at 2:16 pm.

katarey

Reputation Points: 39

Solved Threads: 23

Junior Poster

Offline

167 posts
since Jul 2005

Permalink

Feb 21st, 2008

Re: simple Javascript counting function

thanks katarey, that was exactly what I was looking for

hooray

Reputation Points: 11

Solved Threads: 6

Junior Poster in Training

Offline

62 posts
since Jan 2008

This thread is solved

Either the thread starter or a moderator has marked this thread as solved. You can most likely trust the responses and answers given. There is most likely no reason for any further responses to be posted here. If you have a related question, please start a new thread in this forum instead.

This thread is more than three months old

No one has posted to this discussion for at least three months. Please let old threads die and do not reply to them unless you feel you have something new and valuable to contribute that absolutely must be added to make the discussion complete. Otherwise, please start a new thread in this forum instead.

Previous Thread in JavaScript / DHTML / AJAX Forum Timeline: I need HTML Dropdown Buttons to freeze Flash animation below it! urgent!please help!

Next Thread in JavaScript / DHTML / AJAX Forum Timeline: drop down menu going behind flash element please help

DaniWeb Message

Cancel Changes

User Name
Password