Textarea

[lamp]

Hello,

I want 1 Textarea which can take only 20 characters. It can't input
more
than 20 characters.

Please, guide me.

Thanks in advance

 

[Tom Cole]

Hello,

I want 1 Textarea which can take only 20 characters. It can't input
more
than 20 characters.

Please, guide me.

Thanks in advance

You can use the onkeyup event to capture each keypress and test for
length. If over 20 then truncate it to the first 20. Use onkeyup,
because onkeypress or onkeydown will append the character AFTER your
function has been called, resulting in 21 characters, where the 21st
character changes to the last typed character.

For example let's say we have a textarea with id="test":

function testLength() {
var value = document.getElementById('test').value;
if (value.length > 20) {
document.getElementById('test').value = value.substring(0, 20);
}
}

<textarea id="test" onkeyup="testLength();"></textarea>

Now the test textarea will be limited to 20 characters. HTH.

 

[RobG]

Hello,

I want 1 Textarea which can take only 20 characters. It can't input
more
than 20 characters.

Use an input type text, set the maxlength attribute to 20. No script
required.

 

[Evertjan.]

Tom Cole wrote on 26 apr 2007 in comp.lang.javascript:

You can use the onkeyup event to capture each keypress and test for
length. If over 20 then truncate it to the first 20. Use onkeyup,
because onkeypress or onkeydown will append the character AFTER your
function has been called, resulting in 21 characters, where the 21st
character changes to the last typed character.

For example let's say we have a textarea with id="test":

function testLength() {
var value = document.getElementById('test').value;
if (value.length > 20) {
document.getElementById('test').value = value.substring(0,
20);
}
}

No "if" needed!

===========================================
<script type='text/javascript'>
function testLength(v) {
v.value = v.value.substr(0,20);
}
</script>

<textarea id="test" onkeyup="testLength();"></textarea>

Now the test textarea will be limited to 20 characters. HTH.

But how would you know the letter typed in was the rightmost one?

Try this:

==========================
<script type='text/javascript'>
var textboxtextSave = '';

function testLength(test) {
if (test.value.length > 20)
test.value = textboxtextSave
else
textboxtextSave = test.value;
};
</script>

<textarea onkeyup='testLength(this);'></textarea>
==========================

[This also will warrant some ctrl-V conciderations.]

 

[shimmyshack]

Hello,

I want 1 Textarea which can take only 20 characters. It can't input
more
than 20 characters.

Please, guide me.

Thanks in advance

dont forget that any script you use cannot stop POST data alteration
before it arrives on your server, so is no guarantee that the maximum
will be honoured; as well as this, you might find that using the
onchange attribute is better than onkeyup say, because people might
simply copy and paste using the mouse.

 

[shimmyshack]

Hello,

I want 1 Textarea which can take only 20 characters. It can't input
more
than 20 characters.

Please, guide me.

Thanks in advance

well i shouldnt have said onchange of course! and im still not sure
how to trap the mouse paste event without using a messy interval
check, it wont be "live"

you could also provide user feedback using a disabled input, say:
<textarea name="textareaname" onkeyup="return checknumber()"
onfocus="checknumber()" onblur="checknumber()"></textarea>
<input disabled type="text" name="remaining" size="3" value=""/>

and the following function is called each time a user types somthing:

function checknumber()
{

var msgLen = 20;
var maxChars = msgLen;
var numChars = document.formname.textareaname.value.length;

if (numChars > maxChars)
{
document.formname.textareaname.value =
document.formname.textareaname.value.substring(0,maxChars);
numChars = maxChars;
document.formname.textareaname.focus();
r = false;
}
else {
r = true;
}

var c = numChars;
var numMsgs = 0;
while (c > 0)
{
numMsgs++;
c -= msgLen;
}

document.formname.remaining.value = maxChars - numChars;
return r;
}

you might have to print the textarea and input dynamically if the
input doesnt update as required.