Back To Programming / Scripting / Coding Forum

limit characters in input box with countdown.

  • meman
  • Web Master
  • Web Master
  • User avatar
  • Joined: 03 Aug 2004
  • Posts: 3432
  • Loc: London Town , Apples and pears and all that crap
  • Status: Offline

Post February 14th, 2005, 12:53 pm

Iv been trying to add a visible countdown to limit the number characters a user can type into the input box.

Line number On/Off
Code: Select all
<form action="send.php?" method="post" id="addShout">
<div><label for="shoutName">Name:<br></label><input type="text" style="background-color: #0033FF; color: red; font-weight: bold; border: red dashed 1px" name="name" size="15" id="shoutName"/></div>

<div><label for="shout">Shout:<br></label><input type="text" style="background-color: #0033FF; color: red; font-weight: bold; border: red dashed 1px" name="shout" size="50" id="shout"/></div><br>

<div><input type="submit" style="background-color: black; color: red; font-weight: bold; border: blue dashed 1px" id="submit" value="send" /></div>

</form>


I need to limit the second box (shout) to 70 characters and have a countdown from 70.

Does anybody know how to do this? its driving me nuts.
Everything i have tried hasnt even come close to what im trying to do.

Any help would be great!
  • Anonymous
  • Bot
  • No Avatar
  • Joined: 25 Feb 2008
  • Posts: ?
  • Loc: Ozzuland
  • Status: Online

Post February 14th, 2005, 12:53 pm

  • lucassix
  • Mastermind
  • Mastermind
  • User avatar
  • Joined: 13 Sep 2004
  • Posts: 2336
  • Loc: Living in a VAN DOWN BY THE RIVER!
  • Status: Offline

Post February 14th, 2005, 1:15 pm

Something like here?
http://www.vtext.com/customer_site/jsp/messaging_lo.jsp
  • meman
  • Web Master
  • Web Master
  • User avatar
  • Joined: 03 Aug 2004
  • Posts: 3432
  • Loc: London Town , Apples and pears and all that crap
  • Status: Offline

Post February 14th, 2005, 1:37 pm

I get a gateway timeout from that site.

I drew a pic.

Image
  • RichB
  • Guru
  • Guru
  • User avatar
  • Joined: 17 May 2003
  • Posts: 1121
  • Loc: Boston
  • Status: Offline

Post February 14th, 2005, 1:40 pm

Maybe something like this?

Line number On/Off
Code: Select all
<html>
<head>
<title>Untitled</title>
<style type="text/css">
<!--
.shout {background-color: #0033FF; color: red; font-weight: bold; border: red dashed 1px}
-->
</style>
</head>
<body>
<form action="send.php?" method="post" id="addShout">
<div><label for="shoutName">Name:<br></label><input type="text" class="shout" name="name" size="15" id="shoutName" /></div>

<div><label for="shout">Shout:<br></label><input type="text" class="shout" name="shout" size="70" maxlength="70" id="shout" onkeyup="document.getElementById('count').value=70-this.value.length" /></div><br>

<div><label for="count">Characters left: <br></label><input type="text" class="shout" name="count" size="2" id="count" value="70" /></div><br>

<div><input type="submit" style="background-color: black; color: red; font-weight: bold; border: blue dashed 1px" id="submit" value="send" /></div>

</form>
</body>
</html>
  • meman
  • Web Master
  • Web Master
  • User avatar
  • Joined: 03 Aug 2004
  • Posts: 3432
  • Loc: London Town , Apples and pears and all that crap
  • Status: Offline

Post February 14th, 2005, 2:01 pm

Yeah exactly like that, top man.

Thanks a lot Rich.

Post February 14th, 2005, 2:20 pm

Here is a code I used a while back:

Line number On/Off
Code: Select all
<html>
<head>
<script type="text/javascript" language="text/javascript">
   
   function count_chars() {
      counter = document.MyForm.shout.value
      left = (100 - (counter.length))
         
         if ( left <= 0 ) {
            document.MyForm.count.value = 0
            document.MyForm.shout.value = document.MyForm.shout.value.substr(0,100)
         } else {
            document.MyForm.count.value = left
         }
   }

</script>
</head>
<body>
<form action="makeshout.php" method="post" name="MyForm">

<div>
   <label for="shoutName">Name:<br></label>
      <input type="text" name="name" size="20">
</div>
<div>
   <label for="shout">Shout:<br></label>
      <input type="text" name="shout" size="50" onkeyup="count_chars()">
      <input type="text" name="count" size="4" style="background: silver;" READONLY>
</div><br>
<div>
      <input type="submit" value="submit" /></div>

</form>
</body>
</html>


It only allows 100 characters, and if you exceded that 100, it stops you from writing more..

Page 1 of 1

Post Information

  • Total Posts in this topic: 6 posts
  • Moderator: Moderator Team
  • Users browsing this forum: No registered users and 112 guests
  • You cannot post new topics in this forum
  • You cannot reply to topics in this forum
  • You cannot edit your posts in this forum
  • You cannot delete your posts in this forum
  • You cannot post attachments in this forum
 
 

© Unmelted Enterprises 1998-2009. Driven by phpBB © 2001-2009 phpBB Group.