Immediately after calling:

$(this).autoResize();


In the calling javascript. This simulates a keypress in the box which triggers the auto-resize.

To clarify, I set up the auto-resize with the following code:


$(document).ready(function(){
$('.myclass textarea').each(function() {
$(this).autoResize();
$(this).keydown();
});
});


Christian

Unfortunately I’ve found a hole for people who have web standards in mind; defining ROWS & COLS doesn’t affect HEIGHT of the TEXTAREA, but it does affect the SCROLLTOP() value, causing unexpected height changes on this plugin. ROWS & COLS attributes are are required on TEXTAREAs according to W3C standards, whereas the demo TEXTAREA here don’t specify these attributes.

For instance if ROWS=”100″ were to be declared with this plugin in use, the SCROLLTOP() value returns LINE-HEIGHT*100ROWS, even if there’s no input at all.

So to solve this problem, I added

$(this).removeAttr(‘rows’).removeAttr(‘cols’);

before

// Get rid of scrollbars and disable WebKit resizing:
var textarea = $(this).css({resize:’none’,'overflow-y’:'hidden’}),

to delete ROWS & COLS attributes if the plugin is loaded correctly.
This will make the markup pass the W3C standards by leaving out the ROWS & COLS attributes for clients who don’t have Javascript enabled, and at the same time stop the ROWS & COLS attributes from affecting the SCROLLTOP value if the plugin works correctly.

great work and very useful!

However… I have found an odd bug (using FF 3.0.15 and 3.5.5 on windows), though and having real trouble figuring out what may be causing it!

If you have exactly 61 lines of text in an “autoresized” text area it works perfectly. (i.e. 60 lines with anything on them and CRLF at the end of the line and a 61st line with just text but no CRLF)

If you have 62 lines (or more) of text then it does not auto-resize. Do you (or anybody else) have any ideas about what might be causing this or how it could be fixed? It seems very odd!

This can be shown by creating 61 lines of text (just blank lines will do) and typing 61 on the last line. If you copy it all and paste into the autoresize box on this page it works fine.

If you then
(1) clear the box on this page, then
(2) add a 62nd line to your text document and
(3) copy/paste the 62 lines of text into the box on this page

You should see that the autoresize area stays at its original (small) size and does not expand. On IE8 the bug manifests slightly differently – very long text results in a text area that does not show all the content on screen, but yet has no scroll bars.

Any ideas or solutions would be great!

Christian

Iv got this plugin working nicely but have one problem.
When I edit a record that has lots of text in a textarea, its not expanded (showing all the text) until you type inside the textarea for your plugin to do its thing.

Any ideas? (or know what im talking about :S)

Thanks!

Quick question: Is there any particular reason Safari’s textarea resize handle disappears when using this plugin? I use those quite a bit myself and wouldn’t want to take away that option for Safari users.

$(‘#my_textarea’).one(‘focus’, function(){
$(this).trigger(‘keydown’);
});

It works fine in FF and Safari, but not under IE8. When focused, the textarea (with content) resizes to an incorrect size, and then when a change/keyup/keydown event occurs, it resizes to the correct size… It seems that the clone.scrollTop() value is incorrect at the time of the focus event.