title: Add new object into existing json
body: <p>I have <code>dropdown</code> like this.</p>
  
  <pre><code>&lt;input id="tripFrom" type="text" 
     angular-select2="{type:'typeahead',placeholder:'- Select -'}" 
     select-typeahead-params="{removeTripId:currentTrip.customerDetails.tripToID, type:'startsFrom'}" 
     select-typeahead-url="getTripFrom('startsFrom')"
     ng-model="currentTrip.fromTripID" 
     select-text="currentTrip.startingAreaName" 
  /&gt;
  </code></pre>
  
  <p>For this <code>dropdown</code> I am getting data like this:</p>
  
  <pre><code>{"success":true,
   "items":[
     {"id":56565,"text":"andra"},
     {"id":56568,"text":"tamilnadu"}
   ]
  }
  </code></pre>
  
  <p>My question is when I add some new text in <code>dropdown</code> (which is not present in <code>dropdown</code>)I need to create its as new <code>object</code> inside of <code>items</code>.</p>
  
  <p>When I <code>blur</code> the <code>dropdown</code> new added data should be displayed in that <code>dropdown</code> as selected.</p>
  
  <p>This what I have added:</p>
  
  <pre><code>$('#s2id_autogen8_search').change(function(){
    var data=[];var items={};
    var newAddress=$('#s2id_autogen8_search').val();
    var newId=Math.floor(Math.random()*1000000+1);
    var newTripAddress={id:newId,text:newAddress}
    items.id=newId;
    items.text=newAddress;
   data.push(items)
    /*$("#tripFrom").select2({
      data : newTripAddress})*/
  });
  </code></pre>
  
  <p>But my input is not displaying when I <code>blur</code> it. What I did wrong?</p>