title: Select2 dynamic data setting
body: <p>I am trying to use select2 with jQuery 1.9.1 and select2 3.3.0 to implement what I imagine is a fairly basic use case...I want to populate a select2 control with options based on the state of another select2 control.</p>
  
  <p>I have the following:
  <code></p>
  
  <pre><code>&lt;div&gt;
    &lt;select id="master" name="master"&gt;
      &lt;option value=1&gt;a&lt;/option&gt;
      &lt;option value=2&gt;b&lt;/option&gt;
    &lt;/select&gt;
  &lt;/div&gt;
  &lt;div&gt;
    &lt;input type="hidden" id="detail" name="detail" data-placeholder="No options until master chosen"&gt;
    &lt;/select&gt;
  
  &lt;script src="jquery-1.9.1.js"&gt;&lt;/script&gt;
  &lt;script src="select2-3.3.0/select2.js"&gt;&lt;/script&gt;
  &lt;script&gt;
  var a = [];
  var b = [];
  for (var i = 0; i &lt; 20; i++) {
    a.push({id: i, text: "a" + i});
    b.push({id: i, text: "b"+ i});
  }
  
  $(document).ready( function () {
    $("#master").select2().on('change', function() {
      console.log("master changed: " + $("#master").val())
      var right_one = a;
      if($("#master").val() == 2) right_one = b;
      $("#detail").removeClass('select2-offscreen').select2({data:right_one})
      console.log("right_one: " + right_one)
    })
  
  
  })
  </code></pre>
  
  <p>
  </code></p>
  
  <p><strong>Edit:</strong>
  <a href="https://stackoverflow.com/a/13269663/264788">This answer</a> shows why the control was disappearing. I have questions remaining regarding this implementation:</p>
  
  <ol>
  <li>How can I make #master <em>not</em> have an initial selection?</li>
  <li>How can I change the placeholder text in #detail so that it
  responds to the fact that a master has been chosen?</li>
  </ol>