Geek asks and answers

How to make textarea autogrow using ember.js?

How can I create an TextArea autogrow plugin with ember.js? It does not seem to work with Ember.TextArea.

I tried this (coffeescript):

  App.TextField = Ember.TextArea.extend
    didInsertElement: ->
      opts =
        animate: false
        cloneClass: 'faketextarea'
      @$().autogrow(opts)
+5
source share
2 answers

The problem seems to be related to how Ember gets this.$()for the view, which doesn’t play very well with the autoload plugin, which causes autogrow to listen to events incorrectly on TextArea. Explicitly creating a selector using a elementIdview allows your example to work.

I am using Ember 1.0.0-PRE.4

Example: http://jsbin.com/adedag/8/edit

App.TextField = Ember.TextArea.extend({
  didInsertElement: function() {
    opts = {
      animate: false,
      cloneClass: 'faketextarea'
    }
    $('#'+this.get('elementId')).autogrow(opts);
  }
});
+7
source

Bower, : http://www.jacklmoore.com/autosize/

"dependencies": {
    "jquery": "~2.0",
    "ember": "1.2.0-beta.4",
    "ember-data-shim": "v1.0.0-beta.3",
    "handlebars": "1.1.2",
    "jquery-autosize":""
},


App.AutosizeTextArea = Ember.TextArea.extend({
didInsertElement: function() {
    $('#'+this.get('elementId')).autosize();
}

});

{{view App.AutosizeTextArea value=notes}}
+6

More articles:


All Articles