Reputation: 3796
I have code that is intended to show the user the number of remaining characters available
in text boxes and text areas. Only the code works flawlessly for <input type="text">
's and doesn't work at all for <textarea>
's.
I'm not sure why... My code is below
My js--
function toCount(entrance,exit,text,characters) {
var entranceObj=getObject(entrance);
var exitObj=getObject(exit);
var length=characters - entranceObj.value.length;
if(length <= 0) {
length=0;
text='<span class="disable"> '+text+' </span>';
entranceObj.value=entranceObj.value.substr(0,characters);
}
exitObj.innerHTML = text.replace("{CHAR}",length);
}
My html
<textarea style="overflow-x: hidden;" value="<%=strVariable %>" type="text" id="gBann"
name="MyName" maxlength="1000" size="1000" rows="8" cols="40"
onKeyUp="toCount('gBann','uBann','{CHAR} characters remaining',1000);" >
</textarea>
<span id="uBann" class="minitext">1000 characters remaining</span>
Upvotes: 0
Views: 4001
Reputation: 1
Please try this javascript:
function Counter(txtfield, limit) {
if (txtfield.value.length > maxlimit)
txtfield.value = txtfield.value.substring(0, maxlimit);
// else, update 'characters left' counter
else {
document.getElementById('myCounter').innerHTML = maxlimit - txtfield.value.length
}
}
Here "myCounter" is a span id as in 500 and "txtfield" is the textarea ID.
My ASP code:
<asp:TextBox ID="txtMessage" onKeyUp="javascript:textCounter(this,<%=Count%>);" onKeyDown="javascript:textCounter(this,<%=Count%>);"></asp:TextBox>
Upvotes: 0
Reputation: 7254
You want to use document.getElementById
instead of getObject.
So the following works:
function toCount(entrance,exit,text,characters) {
var entranceObj=document.getElementById(entrance);
var exitObj=document.getElementById(exit);
var length=characters - entranceObj.value.length;
if(length <= 0) {
length=0;
text='<span class="disable"> '+text+' <\/span>';
entranceObj.value=entranceObj.value.substr(0,characters);
}
exitObj.innerHTML = text.replace("{CHAR}",length);
}
Upvotes: 2
Reputation: 13341
I'm not sure if this will solve your problem, but a textarea
doesn't work like an input[type=text]
in the sense that you have to echo the value inside the element like this:
<textarea>test</textarea>
Instead of this:
<textarea value="test"></textarea>
However, the value
attribute of a textarea DOM element should be accessible in the same way, as can be seen here:
Upvotes: 0