in first text box i am getting all the cities from a jquery function
var months = [<?=$city;?>];
$('#tbCountries1').autocomplete({
source : months,
minLength: 0,
minChars: 0,
max: 12,
autoFill: true,
mustMatch: true,
matchContains: false,
scrollHeight: 220,
formatItem: function(data, i, total) {
if ( data[0] == months[new Date().getMonth()] )
return false;
return data[0];
}
}).on('focus', function(event) {
var self = this;
$(self).autocomplete( "search", "");;
});
and onblur i am calling an ajax function which fetch all the areas in that city.
but now i want all that areas in another jquery function from which area textbox will show results
Ajax funxtion:
function getarea(city){
$.ajax({
url: '<?php echo base_url()?>Home/getArea',
type: 'POST',
data: {id: city},
success: function(data) {
availableTags = data;
}
});
}
and another jquery method from where i am fetching areas
$(document).ready(function() {
$('.select2').select2();
});
$( function() {
var availableTags = ['sample area1', 'sample area2'];
$( "#tbCountries" ).autocomplete({
source: availableTags
});
} );
check gist for all the codes and page link to better understand the functionality i want to achieve.
please make answer as simple as possible