Posted By

housecor on 09/15/10

Tagged

javascript
jquery

Versions (?)

Last Edited at 09/15/10 11:22am

Statistics

Viewed 956 times

Favorited by 1 user(s)

Related snippets

Enforce maxlength for all textareas on page

/ Published in: JavaScript

Just be sure to slap the div for the chars left message within the same div/p as the textarea so the dom walk works.

Expand | Embed | Plain Text

Copy this code and paste it in your HTML

$('textarea').keyup(function () {
	var max = 4000;
	if ($(this).val().length > max) {
		$(this).val($(this).val().substr(0, max));
	}
 
	$(this).parent().find('.chars_remaining').html('You have ' + (max - $(this).val().length) + ' characters remaining').show();
});
 
//hide chars remaining count on blur
$('textarea').blur(function () { $('.chars_remaining').fadeOut('fast'); });
 
//and in the front end:
<span class="chars_remaining ui-state-highlight"></span>