title: How to pre-select values in select2 multi select?
body: <p>I am having a multiple select like this:</p>
  
  <pre><code>&lt;select multiple="multiple" class="myList"&gt;
          &lt;option value="1" selected="selected"&gt;Apple&lt;/option&gt;
          &lt;option value="2" selected="selected"&gt;Mango&lt;/option&gt;
          &lt;option value="3" selected="selected"&gt;Orange&lt;/option&gt;
  &lt;/select&gt;
  </code></pre>
  
  <p>Now, apart from those options which must come selected in the select box, I wanted additional ajax functionality which would give values from a remote source.</p>
  
  <p>Here is my code for select2</p>
  
  <pre><code>$(function(){
      $(".myList").each(function(){
  
                  $(this).select2({
                  placeholder: "Search for fruits",
                  minimumInputLength: 2,
                  multiple: true,
                  id: function(e) { 
                  return e.id+":"+e.name; },
                  ajax: {
                      url: "https://localhost:8443/fruit_search",
                      dataType: 'json',
                      data: function(term, page) {
                          return {
                              q: term
                          };
                      },
                      results: function(data, page) {
                      var frts=[];
                          $.each(data,function(idx,Frt){
                              frts[frts.length]=Frt;
                          });
                          return {
                              results: frts
                          };
                      }
                  },
                  initSelection: function(element, callback) {
                      var data = [];
                  },
                  formatResult: formatResult,
                  formatSelection: formatSelection
                  });
          });
  
  });
  </code></pre>
  
  <p>But I am getting the error:</p>
  
  <blockquote>
    <p>Error: Option 'id' is not allowed for Select2 when attached to a
    <code>&lt;select&gt;</code> element.</p>
  </blockquote>
  
  <p>But when I use <code>&lt;input type="hidden"&gt;</code> then where should I keep the pre-selected options? How do I show them up when the select2 box appears?</p>