Reputation: 1117
I have dropdown
like this.
<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"
/>
For this dropdown
I am getting data like this:
{"success":true,
"items":[
{"id":56565,"text":"andra"},
{"id":56568,"text":"tamilnadu"}
]
}
My question is when I add some new text in dropdown
(which is not present in dropdown
)I need to create its as new object
inside of items
.
When I blur
the dropdown
new added data should be displayed in that dropdown
as selected.
This what I have added:
$('#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})*/
});
But my input is not displaying when I blur
it. What I did wrong?
Upvotes: 4
Views: 117
Reputation: 1520
Try using the blur instead of the change event.
$('#s2id_autogen8_search').change(function(){
// use this instead
$('#s2id_autogen8_search').on('blur', function(){
It might be as simple as that.
Upvotes: 1