Force jQuery plugin to evaluate CSS classes on edit

[Arrow7000]

I am using this jQuery plugin that autoresizes a textarea automatically. It is implemented by adding a class of autosize on the textarea element. However when I add this on a p element with the attribute of e-class="autosize" in editing mode the element stays a regular text area without the autosizing behaviour, even though I can see that the classes have been applied.

I presume this is because the plugin traverses the page for all textareas and transforms them on page load, whereas my p only becomes a textarea later on.

Is there anything I can do to make my textarea get the autosize behaviour?

Thank you

[ckosloski]

Maybe try adding onshow='autosize($('textarea'));' (or however you are calling the resize) to the p element.

[Arrow7000]

That doesn't work. It looks like it's adding the right classes and attributes to the textarea element - going by the console output - but it's not actually resizing.

The first textbox on the left is a textarea. As you can see it stays small and doesn't resize on typing into it.

I've done it manually in the console to ensure I'm not making a mistake in selecting the elements with Angular.

EDIT although actually on hovering over the console elements it looks like the first element in the console is the first textarea, which doesn't seem to have gotten any of the attributes...

[ckosloski]

Can you create a jsfiddle or plunker showing the issue?

[Arrow7000]

Sorry last fiddle was wrong. Here is the right one: http://jsfiddle.net/NfPcH/15381/

[ckosloski]

That fiddle is throwing a js error:

TypeError: angular.element(...).find(...).autosize is not a function http://fiddle.jshell.net/NfPcH/15381/show/ Line 108

[celluj34]

Probably because angular.element returns a jqLite object, not a jQuery object.

@Arrow7000 you could try attaching your resize function to the jqLite prototype.

[ckosloski]

@Arrow7000 are you still having an issue?