The JavaScript SearchBox
can act as an all-in-one Widget, you don't need to add extra events to handle the key presses. You can initialise it as you have shown, but you'll need to ensure that the targetNode
matches the id
of a <DIV>
already present in the DOM. e.g you could use targetNode = waypoint1
if you include the following
<div id="waypoint1" class="main-search">
<span class ="caption">Start:</span>
<div module="SearchBox">
<input rel="searchbox-input" class="search-box-bckgrnd" type="text" />
<div rel="searchbox-list" class="search-list"></div>
</div>
</div>
A working routing example can be found in the HERE Maps Community Examples.
The searchCenter
helps to define the location context of the search - it is better described in the RESTful Places Documentation. Specifically it maps onto the at
parameter. The other alternative is to attach the widget to an associated map which will supply an in
parameter instead. Note that the Widget only starts to give suggestions after typing at least three characters.
It is of course possible to build up your own Widget from scratch using JQuery - just use keyup, create a REST request using the suggest endpoint and parse the resultant String array into a drop-down of your choice.