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...