title: Custom binding for $.expandingTextarea with knockout.js
body: <p>I am writing a custom binding to use <a href="https://github.com/bgrins/ExpandingTextareas" rel="nofollow">$.expandingTextarea</a> with <a href="http://knockoutjs.com/" rel="nofollow">Knockout.js</a>.</p>
  
  <p>Following the excellent article <a href="http://www.knockmeout.net/2011/07/another-look-at-custom-bindings-for.html" rel="nofollow">Another Look at Custom Bindings for KnockoutJS</a>, I hoped it would be as simple as:</p>
  
  <pre><code>ko.bindingHandlers.expandingTextarea = {
    init: function(element, valueAccessor) {
      $(element).expandingTextarea();
    },
     update: function(element, valueAccessor, aBA, vm) {
      ko.bindingHandlers.value.update(element, valueAccessor, aBA, vm);
      $(element).expandingTextarea("resize");
    }
  }
  </code></pre>
  
  <p>Unfortunately this does not work as expected - i.e. when changes are made to the textarea, the corresponding view model is not updated. Here's a <a href="http://jsfiddle.net/bmh_ca/pxZmH/" rel="nofollow">jsFiddle that illustrates</a> the problem.</p>
  
  <p>How does one create a KO custom binding for the expandingTextarea plugin?</p>