I'm trying to create an edit page, where the user can edit his content in a textarea resized to fit the content and I'm using this plugin to do that: http://www.jacklmoore.com/autosize/
But when I access the edit page the textarea doesn't resize to fit the content, this only happens if I refresh the page manually. Here is the code:
<template name="postEdit">
<textarea autofocus name="content" type="text" value="">{{content}}</textarea>
</template>
Template.postEdit.rendered = function() {
$('textarea').autosize();
};
I also tried with Meteor.defer, but it doesn't work:
Template.postEdit.rendered = function() {
Meteor.defer(function() {
$('textarea').autosize();
});
};
When I refresh the page manually and the textarea finally resizes, the textarea html changes for this:
<textarea class="review" name="review" type="text" value="" placeholder="Blablabla" style="overflow: hidden; word-wrap: break-word; resize: horizontal; height: 664px;"></textarea>
Is there any problem with my code or my approach is wrong?
Thanks.
As it states in the 'Known Issues & Solutions' Docs of jQuery Autoresize you might want to do:
Template.hello.rendered = function(){
$('textarea').autosize().show().trigger('autosize.resize');
}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With