Jump to content

Recommended Posts

OK, i am completely stumped here. Hope someone might be able to spot something i have done wrong.

 

I have a simple js function which counts the characters of a text area:

function finalCount(){
var fintxt = document.getElementById('final_comment').innerHTML

var fintxt_len = fintxt.length

document.getElementById('char_count').innerHTML = fintxt_len
}

 

The function is called on the following textarea:

<textarea id="final_comment" name="final_comment" onKeyUp="finalCount()"></textarea>

 

The problem is, after each "onKeyUp" the function is only returning getting the original content of the textarea.

 

It is not working in FF or Chrome

However it is working is IE. It returns the "live" content count of the textarea.

 

I really am at a complete loss as to what is going on... could any body help?

I know this a quite a few post on the same issue with no replies... but just incase.... here is the text html:

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<script type="text/javascript">
function finalCount(){
var fintxt = document.getElementById('final_report').innerHTML

var fintxt_len = fintxt.length
alert(fintxt_len)
document.getElementById('char_count').innerHTML = fintxt_len
}
</script>
</head>
<body>
<span id=\"char_count\">0</span><br/>
<textarea id="final_report"name="final_report" onKeyUp="finalCount()"></textarea>
</body>
</html>

 

I know i must be doing something wrong... but i just can't see it. The alert in the js function is just to show me what the js function is getting for the innerHTML content of the textarea. It's still just returning the original content from load.

Have you tried to see if this works with jQuery? It's pretty much as simple as:

 

$('#target').keyup(function() {
  var inputLength = $('#target').length();
   if(inputLength > 140)
  {
       //blah blah, blah, what do you want to happen once the limit is reached?

  }
});

I could go the jquery root, however it does seem for such a small thing that requiring the user to download a jquery library seems a little ott.

 

If someone knows how to get a simple char count working i would be very grateful. The above basic html page with the function in the header just isn't working and i can't for the life of me figure out whats going on.

 

Pleeaassee somebody help....  :-* haha

 

function finalCount(){
if (document.getElementById('final')){
	var textarea = document.getElementById('final')
	var txtContent = textarea.value
	var fintxt_len = txtContent.length
}
else{var fintxt_len=0}
document.getElementById('char_count').innerHTML = fintxt_len
}

 

Ok this works. I had to tell the JS to get the value of the textarea and not the innerHTML which is really bizzare to me as i thought the content of the textarea was its innerHTML.

I'm glad you got it working, and I'll file what you learned away for my own future use :)

 

Re jQuery: I'd argue that jQuery is such a time saver, especially with cross browser issues, that it's worth using for everything, not just for the one function. 

This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.