Our app needs to allow users to search by a number of landmarks. We will keep the functionality simple, and let the user enter the town names, separated by a comma, into a textbox. A JavaScript file, router.js, which we will save inside the Scripts folder, will handle this.
(function () {
var lbm = window.lbm || {};
lbm.Router = function (map, $) {
this._map = map;
this.$ = $;
};
Microsoft.Maps.moduleLoaded('lbm.Router');
})();You will recognize by now that this is an AJAX Control module. Like the previous modules, it accepts a Microsoft.Maps.Map class instance, which it stores in a private _map instance variable.
To incorporate the textbox on the map, we write the following method:
_addTextbox: function(self) {
var html = [
'<div class="lbm-router-text-wrp">',
'<input type="text" id="lbm-router-text" placeholder="Enter places and press ENTER" value="barcelona,madrid" />',
'</div>'
];
this._mapContainer.append(html.join...