Search code examples
ember.jsautogrow

How to make textarea autogrow using ember.js?

How can I make the TextArea autogrow plugin work 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)
Solution

  • There seems to be an issue with the way Ember gets this.$() for the view that doesn't play nicely with the autogrow plugin, causing autogrow to not correctly listen for events on the TextArea. Explicitly creating the selector using the elementId of the view allows your example to work.

    I'm 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);
  }
});