title: Jquery Chosen plugin - dynamically populate list by Ajax
body: <p>Im trying to build my dropdown menu using the plugin Chosen for <strong>Multiple Select</strong> .
  Here's to behavior I'm based on:</p>
  
  <p><a href="http://jsfiddle.net/JfLvA/" rel="noreferrer">http://jsfiddle.net/JfLvA/</a></p>
  
  <p>So, instead of having 3 harcoded &lt; option > in my select. I want this list to be the values of a json array populated by an ajax request. This will be triggered by autocomplete.</p>
  
  <p>So, if the user type "car", im sending the letter via an ajax call, and im getting back an array like that:</p>
  
  <p>[{"id":"2489","name":"carrie"},{"id":"2490","name":"Caroline"},{"id":"2491","name":"Carole"}]</p>
  
  <p>The code:</p>
  
  <pre><code>$(function() {
  
  $(".chzn-select").chosen();
  $(".chzn-select-deselect").chosen({allow_single_deselect:true});
  
  $('.chzn-choices input').autocomplete({
     source: function( request, response ) {
        $.ajax({
            url: "/change/name/autocomplete/"+request.term+"/",
            dataType: "json",
            success: function( data ) {
               response( $.map( data, function( item ) {
                  $('ul.chzn-results').append('&lt;li class="active-result"&gt;' + item.name + '&lt;/li&gt;');
  
            }
         });
      }
  });
  </code></pre>
  
  <p>Result:</p>
  
  <p>I type "car", in the dropdown Im getting "No result for car" and then I have all my results, as I want.</p>
  
  <p><strong>1. Why I'm I getting the "No result" message, cause I can see in my json array and inside my list that I'm getting results.</strong></p>
  
  <pre><code> -----------------------------
  </code></pre>
  
  <p>When I delete "car" and enter "sam". The results for "sam" are showing after the "car" results. (Basically, I see the result for both, instead of just having the result of my current search)</p>
  
  <p><strong>2. Im I suppose to clear the ul on keyUp?? Thought the plugin was doing that already</strong></p>
  
  <pre><code> -----------------------------
  </code></pre>
  
  <p>When I click on a name to actually select it and add it into the select, Im getting a javascript error inside the chosen.js file</p>
  
  <p>item is undefined<br>
  "item.selected = true;" line 732</p>
  
  <p>the link to the plugin:
  <a href="http://harvesthq.github.com/chosen/chosen/chosen.jquery.js" rel="noreferrer">http://harvesthq.github.com/chosen/chosen/chosen.jquery.js</a></p>
  
  <p>and it's not adding anything inside the select.</p>
  
  <p><strong>3. No idea why this is happening</strong></p>
  
  <pre><code> -----------------------------
  </code></pre>
  
  <p>Do you guys have any idea on what I'm I doing something wrong? I'm completly stuck here...!</p>
  
  <p>Oh and by the way, I dont mind changing the plugin source, as it's the only place where I'm using it....</p>