if I take a look in the framework7.js how the autocomplete object is created it shows in the line 28090
itemHtml = "\n <li>\n <label class=\"item-radio item-content\" data-value=\"" + (item.value) + "\">\n <div class=\"item-inner\">\n <div class=\"item-title\">" + (item.text) + "</div>\n </div>\n </label>\n </li>\n ";
in my case I need to have a radio button and close on select
I think it is missing the radio button as well in the template definition below to be selectable but I tried my way using the itemHtml above as the template but it does not work either… 
…
here the code
// Standalone With Ajax
self.autocompleteStandaloneAjax = app.autocomplete.create({
openIn: "popup", //open in page
openerEl: "#destination-ajax", //link that opens autocomplete
closeOnSelect: true, //go back after we select something
multiple: false, //allow multiple values
renderItem:function (item,index) {
var obj=app.utils.extend(item,this.items[index]);
// you can/need change the tmpl to what you want
var tmpl='<li>\
<div class="item-content" data-latlng="{{LatLng}}" data-country-code="{{CountryCode}}">\
<div class="item-inner">\
<div class="item-title">{{Name}}, {{CountryName}}</div>\
<div class="item-after"></div>\
</div>\
</div>\
</li>';
return Template7.compile(tmpl)(obj)
},
valueProperty: "ID", //object's "value" property name
textProperty: "Name", //object's "text" property name
limit: 50,
requestSourceOnOpen: false,
preloader: true, //enable preloader
source: function(query, render) {
var data = [];
var autocomplete = this;
var results = [];
if (query.length <= 1) {
results = data;
render(results);
return;
}
// Show Preloader
autocomplete.preloaderShow();
// Do Ajax request to Autocomplete data
console.log('query');
console.log(query);
app.request({
url: "assets/_request_cities.php",
method: "POST",
dataType: "json",
//send "query" to server. Useful in case you generate response dynamically
data: {
query: query
},
success: function(data) {
console.log(data);
// Find matched items
for (var i = 0; i < data.length; i++) {
if (
data[i].name.toLowerCase().indexOf(query.toLowerCase()) >= 0
)
results.push(data[i]);
}
// Hide Preoloader
autocomplete.preloaderHide();
// Render items by passing array with result items
console.log('autocomplete data');
console.log(data);
render(data.cities);
}
});
},
on: {
change: function(value) {
var itemText = [],
inputValue = [];
for (var i = 0; i < value.length; i++) {
itemText.push(value[i].Name);
inputValue.push(value[i].ID);
}
// Add item text value to item-after
$("#destination-ajax")
.find(".item-after")
.text(itemText.join(", "));
// Add item value to input value
$("#destination-ajax")
.find("input")
.val(inputValue.join(", "));
}
}
});
and the json returned from the php file is this structure
{ “cities”: [ { “ID”: “LDY”, “CityCode”: “LDY”, “Name”: “Londonderry”, “LatLng”: “54.9966,-7.30857”, “CountryCode”: “GB”, “CountryName”: “United Kingdom” }, { “ID”: “84747”, “CityCode”: “84747”, “Name”: “Londonderry”, “LatLng”: “42.8651,-71.3739”, “CountryCode”: “US”, “CountryName”: “United States” }, { “ID”: “46337”, “CityCode”: “46337”, “Name”: “Londonderry”, “LatLng”: “43.2264,-72.8069”, “CountryCode”: “US”, “CountryName”: “United States” } ] }
