title: Select2 overwrites knockout observableArray with string
body: <p>I'm using select2 with a custom knockout binding to provide dynamic tagging support. Unfortunately when the select2 control is modified by the user, the bound observable array is overwritten with a comma separated value string instead of simply adding the new value to the observable array. I'm guessing this has to do with the way I'm binding the input value, but I can't seem to find an alternative approach. Any help would be greatly appreciated!</p>
  
  <p>JSFiddle: <a href="http://jsfiddle.net/gk8a6sht/6/" rel="nofollow">http://jsfiddle.net/gk8a6sht/6/</a></p>
  
  <p>JavaScript:</p>
  
  <pre><code>ko.bindingHandlers.select2 = {
    init: function(element, valueAccessor) {
       var options = ko.toJS(valueAccessor()) || {};
       setTimeout(function() { 
           $(element).select2(options);
       }, 0);
     }
  };    
  
  var viewModel = {
      values: ko.observableArray(["red", "grey", "blue"])
  };
  
  ko.applyBindings(viewModel);
  </code></pre>
  
  <p>Html:</p>
  
  <pre><code>&lt;input data-bind="value: values, select2: { tags: values, tokenSeparators: [',', ' '] }"/&gt;
  </code></pre>