/    Sign up×
Community /Pin to ProfileBookmark

Something very stupid?

I’m using this script to limit the number of characters in a text field, it also shows the user how many characters have already expended. The think is that I’m repeating the function 11 times, it works fine for the 3 first text boxes, but in the 4th, when typing, it shows the NaN message??

THE SCRIPT:

<script language = “Javascript”>
/**
* DHTML textbox character counter (IE4+) script. Courtesy of SmartWebby.com ([url]http://www.smartwebby.com/dhtml/[/url])
*
/

function taLimit() {
var taObj=event.srcElement;
if (taObj.value.length==taObj.maxLength*1) return false;
}

function taCount(visCnt) {
var taObj=event.srcElement;
if (taObj.value.length>taObj.maxLength*1) taObj.value=taObj.value.substring(0,taObj.maxLength*1);
if (visCnt) visCnt.innerText=taObj.maxLength-taObj.value.length;
}
function taLimit1() {
var taObj1=event.srcElement;
if (taObj1.value.length==taObj1.maxLength*1) return false;
}

function taCount1(visCnt1) {
var taObj1=event.srcElement;
if (taObj1.value.length>taObj1.maxLength*1) taObj1.value=taObj1.value.substring(0,taObj1.maxLength*1);
if (visCnt1) visCnt1.innerText=taObj1.maxLength-taObj1.value.length;
}
function taLimit2() {
var taObj2=event.srcElement;
if (taObj2.value.length==taObj2.maxLength*1) return false;
}

function taCount2(visCnt2) {
var taObj2=event.srcElement;
if (taObj2.value.length>taObj2.maxLength*1) taObj2.value=taObj2.value.substring(0,taObj2.maxLength*1);
if (visCnt2) visCnt2.innerText=taObj2.maxLength-taObj2.value.length;
}
function taLimit3() {
var taObj3=event.srcElement;
if (taObj3.value.length==taObj3.maxLength*1) return false;
}

function taCount3(visCnt3) {
var taObj3=event.srcElement;
if (taObj3.value.length>taObj3.maxLength*1) taObj3.value=taObj3.value.substring(0,taObj3.maxLength*1);
if (visCnt3) visCnt3.innerText=taObj3.maxLength-taObj3.value.length;
}
</script>

THE FIELDS:

<TEXTAREA
name=acceso cols=40 rows=7 wrap=physical id=”acceso” onkeypress=”return taLimit()” onkeyup=”return taCount(myCounter)” maxLength=”200″><? if ($row[‘du_acceso’] !=””){echo $row[‘du_acceso’];}else {echo “Under construction”;}?></TEXTAREA>
<SPAN id=myCounter>200</SPAN>

<TEXTAREA
name=acceso cols=40 rows=7 wrap=physical id=”acceso” onkeypress=”return taLimit1()” onkeyup=”return taCount1(myCounter1)” maxLength=”200″><? if ($row[‘du_acceso’] !=””){echo $row[‘du_acceso’];}else {echo “Under construction”;}?></TEXTAREA>
<SPAN id=myCounter1>200</SPAN>

And so on…

to post a comment
JavaScript

3 Comments(s)

Copy linkTweet thisAlerts:
@PittimannJan 07.2004 — Hi!

There is no need to have individual functions. Just try something like this:
<i>
</i>&lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"&gt;
&lt;html&gt;
&lt;head&gt;
&lt;title&gt;Untitled&lt;/title&gt;
&lt;/head&gt;
&lt;body&gt;
&lt;script language="JavaScript" type="text/javascript"&gt;
&lt;!--
function taLimit() {
var taObj=event.srcElement;
if (taObj.value.length==taObj.maxLength*1) return false;
}
function taCount(visCnt) {
var taObj=event.srcElement;
if (taObj.value.length&gt;taObj.maxLength*1) taObj.value=taObj.value.substring(0,taObj.maxLength*1);
if (visCnt) visCnt.innerText=taObj.maxLength-taObj.value.length;
}
//--&gt;
&lt;/script&gt;
&lt;form name="myForm"&gt;
&lt;TEXTAREA name=acceso1 cols=40 rows=7 wrap=physical id="acceso1" onkeypress="return taLimit()" onkeyup="return taCount(myCounter1)" maxLength="200"&gt;&lt;/TEXTAREA&gt;
&lt;SPAN id=myCounter1&gt;200&lt;/SPAN&gt;
&lt;TEXTAREA name=acceso2 cols=40 rows=7 wrap=physical id="acceso2" onkeypress="return taLimit()" onkeyup="return taCount(myCounter2)" maxLength="100"&gt;&lt;/TEXTAREA&gt;
&lt;SPAN id=myCounter2&gt;100&lt;/SPAN&gt;
&lt;TEXTAREA name=acceso3 cols=40 rows=7 wrap=physical id="acceso3" onkeypress="return taLimit()" onkeyup="return taCount(myCounter3)" maxLength="150"&gt;&lt;/TEXTAREA&gt;
&lt;SPAN id=myCounter3&gt;150&lt;/SPAN&gt;
&lt;TEXTAREA name=acceso4 cols=40 rows=7 wrap=physical id="acceso4" onkeypress="return taLimit()" onkeyup="return taCount(myCounter4)" maxLength="250"&gt;&lt;/TEXTAREA&gt;
&lt;SPAN id=myCounter4&gt;250&lt;/SPAN&gt;
&lt;TEXTAREA name=acceso5 cols=40 rows=7 wrap=physical id="acceso5" onkeypress="return taLimit()" onkeyup="return taCount(myCounter5)" maxLength="80"&gt;&lt;/TEXTAREA&gt;
&lt;SPAN id=myCounter5&gt;80&lt;/SPAN&gt;
&lt;TEXTAREA name=acceso6 cols=40 rows=7 wrap=physical id="acceso6" onkeypress="return taLimit()" onkeyup="return taCount(myCounter6)" maxLength="200"&gt;&lt;/TEXTAREA&gt;
&lt;SPAN id=myCounter6&gt;200&lt;/SPAN&gt;
&lt;/form&gt;
&lt;/body&gt;
&lt;/html&gt;

Cheers - Pit
Copy linkTweet thisAlerts:
@PerfidusauthorJan 07.2004 — I have tried that, take a look, in the 4th it gaves me the NaN error when typing!!

[URL=http://costa4seasons.com/formdatosciudades.html?Localidad=Benidorm]http://costa4seasons.com/formdatosciudades.html?Localidad=Benidorm[/URL]
Copy linkTweet thisAlerts:
@PittimannJan 07.2004 — Hi!I have tried that, take a look, ...[/QUOTE]

Unfortunately you did not try that exactly! Starting from the 4th textarea you use maxlength= instead of maxLength=

JaVAscriPt is case sensitive...

cHeERS _ pIt
×

Success!

Help @Perfidus spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 BETA 5.19,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...