Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Register Log in
  • Congratulations Chris Miller on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Count characters in text editor

Status
Not open for further replies.
NickyJay

NickyJay

Programmer
Sep 1, 2003
217
GB
Hi All,

don't know if anyone has any dealing with this or not, I have the FCK Editor in place on my web page (coldfusion).

I want to be able to display the remaining number of characters (my max is 8000 as this is the max field size) for the textarea. I have used the javascript textarea replacement version of FCK editor. i have tried the following but it doesn't recgonise when text is already in the box :(

Code: 
<SCRIPT LANGUAGE="JavaScript">
<!-- Use one function for multiple text areas on a page -->
<!-- Limit the number of characters per textarea -->
<!-- Begin
function textCounter(field,cntfield,maxlimit) {
if (field.value.length > maxlimit) // if too long...trim it!
field.value = field.value.substring(0, maxlimit);
// otherwise, update 'characters left' counter
else
cntfield.value = maxlimit - field.value.length;
}
//  End -->
</script>

<textarea name="content" cols="50" rows="15" onKeyDown="textCounter(document.editor.content,document.editor.remLen2,12)"
onKeyUp="textCounter(document.editor.content,document.editor.remLen2,12)"></textarea>
	
	<input readonly type="text" name="remLen2" size="3" maxlength="3" value="12">characters left<br />
 
Sort by date Sort by votes
Use innerHTML to find the current length.

This:
Code: 
if (field.value.length > maxlimit) // if too long...trim it!

Becomes this:
Code: 
if (String(field.innerHTML).length > maxlimit) // if too long...trim it!




[small]"Mom........MEATLOAF!!!! F***!!!!"[/small]
<.
 
Upvote 0 Downvote
Hey,

thanks, no luck though im affraid!

my textarea field is this:

Code: 
<textarea name="Intro" rows="4" cols="56" onKeyDown="textCounter(document.frm_leaflet.Intro,document.frm_leaflet.remLen2,8000)"
onKeyUp="textCounter(document.frm_leaflet.Intro,document.frm_leaflet.remLen2,8000)">
	<cfoutput query="qryupdateleaflet">#qryUpdateLeaflet.Introduction#</cfoutput>
	</textarea>
                    <script type="text/javascript" src="FCKEditor/fckeditor.js"></script>
                    <script>
						// Automatically calculates the editor base path based on the _samples directory.
						// This is usefull only for these samples. A real application should use something like this:
						//oFCKeditor.BasePath = '/FCKEditor/' ;	// '/fckeditor/' is the default value.
						var sBasePath = "FCKEditor/";
						
						var oFCKeditor = new FCKeditor( 'Intro' ) ;
						oFCKeditor.BasePath	= sBasePath ;
						oFCKeditor.ReplaceTextarea() ;
					</script>
 
Upvote 0 Downvote
What exactly are you having problems with? I copied/pasted your original code and added line spacing and stuff and it worked fine:
Code: 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "[URL unfurl="true"]http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">[/URL]
<html xmlns="[URL unfurl="true"]http://www.w3.org/1999/xhtml">[/URL]
<head>
<title>test</title>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<script type="text/javascript">

function textCounter(field, cntfield, maxlimit) {
   // if too long...trim it!
   if (field.value.length > maxlimit) {
      field.value = field.value.substring(0, maxlimit);
   }
   // otherwise, update 'characters left' counter
   else {
      cntfield.value = maxlimit - field.value.length;
   }
}

</script>
<style type="text/css"></style>
</head>
<body>


<textarea name="content" cols="50" rows="15" onKeyDown="textCounter(this, document.getElementById('remLen2'), 12)"
onKeyUp="textCounter(this, document.getElementById('remLen2'), 12)"></textarea>
    
    <input readonly type="text" name="remLen2" id="remLen2" size="3" maxlength="3" value="12">characters left<br />


</body>
</html>

Does the small test I posted not do what you want it to?

-kaht

Looking for a puppy? [small](Silky Terriers are hypoallergenic dogs that make great indoor pets due to their lack of shedding and small size)[/small]
 
Upvote 0 Downvote
Hi!

the bit you posted didn't seem to do anything!

I need the character count to reflect what is in the textbox, so if the page loads and there is text in the box, for it to count what is in there - can't get my head round it :(
 
Upvote 0 Downvote
the bit you posted didn't seem to do anything!
Click to expand...

Seriously?


Copy/Paste that into a new .html file and retry it. It works just fine, AND it's your code.


If your biggest problem is finding the length when the page loads if the box initially has text in it then just run the function when the page loads.

[google]window onload javascript[/google]

-kaht

Looking for a puppy? [small](Silky Terriers are hypoallergenic dogs that make great indoor pets due to their lack of shedding and small size)[/small]
 
Upvote 0 Downvote
Status
Not open for further replies.

Similar threads

jomat
  • Locked
  • Question
JS to show the timer in html under title instead of in the status bar
Replies
2
Views
692
xwb
xwb
edgarv
  • Locked
  • Question
Field with numbers and characters get nan
Replies
1
Views
186
ggriffit
ggriffit
JScannell
  • Locked
  • Question
Programmatically inserting a newline in a &lt;textarea&gt;, &lt;span&gt;, or &lt;div&gt;
Replies
5
Views
1K
ggriffit
ggriffit
keisha1
  • Locked
  • Question
How can I append/insert multiple text files into one .dbf file using java script /html command
Replies
1
Views
172
Samthyr
Samthyr
waubain
  • Locked
  • Question
First image in slide gallery not showing - Uncaught TypeError: slides[(slideIndex - 1)] is undefined 1
Replies
2
Views
392
waubain
waubain

Part and Inventory Search

Sponsor

Back
Top