How to create a custom map based search bar like yelp?

Question

So I am trying to create a search bar like yelp's that gives places suggestions and the map markers reflect those suggestions as well. I was able to implement a google maps places search bar from the google maps api however, now I want the places search to only show place suggestions on the map that are in my database. How would I go about implementing this? Detailed explanations, tutorials or references would be very helpful.

Answer 1

A good option for this is to use Jquery UI's autocomplete. In web2py you will need to write a controller function that will be called via ajax from jquery UI. Something like (untested):

def places_lookup():

    import json 
    term = request.vars.term
    places = []
    if term:

        rows = db(db.place.name.startswith(term)).select(db.place.name,
                  orderby=db.place.name, limitby=(0,10), distinct=True)

        for row in rows:
            place = dict(name=row.name
                         )
            places.append(place)

    return json.dumps(places)

You'll call this function from javascript using a url like:

var url = "{{=URL('places', 'place_lookup.json')}}?term=" + request.term;

You'll have to read the jquery ui documentation to understand how to setup the javascript.