title: Select2: add new tag dynamically using code
body: <p>I'm using select2 for tagging and I have it setup such that a user can add new tags as well. The issue that I'm dealing with is validating the user entry and adding the sanitized tag to selection. </p>
  
  <p>To be more specific, when a user enters a space in a tag, i use formatNoMatches to display a js link to sanitize the tag and then add the tag programmatically. This code seems to run without errors but when  sanitize is called all selections of the input are cleared.</p>
  
  <p>Any clues where i might be going wrong?</p>
  
  <pre><code>var data=[{id:0,tag:'enhancement'},{id:1,tag:'bug'},{id:2,tag:'duplicate'},{id:3,tag:'invalid'},{id:4,tag:'wontfix'}];
  function format(item) { return item.tag; }
  
  function sanitize(a){
  
      $("#select").select2('val',[{
          id: -1,
          tag: a
        }]);
  
        console.log(a);
  };
  
  $("#select").select2({
    tags: true,
    // tokenSeparators: [",", " "],
    createSearchChoice: function(term, data) {
      return term.indexOf(' ') &gt;= 0 ?  null :
      {
          id: term,
          tag: term
        };
    },
    multiple: true,
    data:{ results: data, text: function(item) { return item.tag; } },  formatSelection: format, formatResult: format,
    formatNoMatches: function(term) { return "\"" + term + "\" &lt;b&gt;Is Invalid.&lt;/b&gt; &lt;a onclick=\"sanitize('"+ term +"')\"&gt;Clear Invalid Charecters&lt;/a&gt;" }
  });
  </code></pre>