Google Maps v3, custom control with textbox: can't perform input

dom-events, google-maps, google-maps-api-3

Solution

Works for me: http://jsfiddle.net/cFpkt/

Problem

I am trying to add a custom control to my google map (v3): I want to have search box just near the other map controls. So I add a div with `<input type="textbox">` on it, and it's being shown on the map. But the problem is that the textbox is inaccessible: I can't type anything inside it, or even focus on it. ``` function SearchBox() { var searchTextBox = $('<input type="text" id="txtGeoSearch" />'); var div = $('<div class="geoSearchBox"></div>') .append($('<span>Search:</span>')) .append(searchTextBox); return div.get(0); } // inside init() geoMap.controls[google.maps.ControlPosition.TOP_LEFT].push(new SearchBox()); ``` So what should I do to make my textbox behave like normal one?

Original source