CODEWITHSUNDEEP
pythonsqlalchemypyramid
Maurice Elagu
Maurice Elagu

Reputation: 704

Hghlight search terms

1.How can i highlight the returned search items or data from the results for example the way ctr + f does with ordinary item/element search in an open file. 2. Add json auto-complete i.e giving suggestions when user types in search bar basing on database data Here is my view code but all it does is return results without really highlighting the search term. Any help pliz:

@view_config(route_name="search", renderer='./templates/search.mako', permission="view") def search(request): search = request.params.get("search", "")
dbsession = DBSession()

##Album Results
query = dbsession.query(Album).join(Artist).join(Genre).join(Song).\
    filter(

        or_(
            Album.album_name.like(search + "%"),
            Artist.artist.like(search + "%"),
            Genre.genre.like(search + "%"),

            )
        )
statalbum = dbsession.query(Album).join(Artist).join(Genre).join(Song).\
    filter(

        or_(
            Album.album_name.like(search + "%"),
            Artist.artist.like(search + "%"),
            Genre.genre.like(search + "%"),

            )
        ).count()

# Songs Results

dbsession = DBSession()
songs = dbsession.query(Song).\
    filter(Song.title.like(search + "%") )

statsong = dbsession.query(Song).\
    filter(Song.title.like(search + "%") ).count()

# paginate 
page_url = paginate.PageURL_WebOb(request)
albums = Page(query, 
                 page=int(request.params.get("page", 1)), 
                 items_per_page=12, 
                 url=page_url)
# paginate songs
songs = Page(songs, 
                 page=int(request.params.get("page", 1)), 
                 items_per_page=12, 
                 url=page_url)
try:
    genres = DBSession.query(Genre).order_by(Genre.genre).all()
    info = DBSession.query(Song).join(Album).filter_by(id=id).filter(Song.album_id == Album.id ).first()
    #albums = DBSession.query(Album).all() 

except DBAPIError:
    return Response(conn_err_msg, content_type='text/plain', status_int=500)
return {  'genres':genres, 'info':info, 'songs':songs, 'albums':albums, 'statsong':statsong, 'statalbum':statalbum, 'project': 'beatstore'}

Upvotes: 0

Views: 49

Answers (1)

Wiz
Wiz

Reputation: 4865

  1. As for highlighting returned search items, you will have to use CSS and change the background color. So something like:

    .highlighted { background-color: #FFFF00; }

    and to highlight a word you would have to enclose it in a span with the class highlighted, as so:

    <span class="highlighted">This is highlighted text</span>

  2. As for retrieving JSON from the database, you will have to create an AJAX call from Javascript that will call the server to get the suggestions. You will probably have to bind the AJAX call on a keypress event; something like:

    $("#text-field").keyup(function() {

    $.getJSON("/url_to_suggestions", function(data) {

    $.each(data, function(key, val) {

        //Do something with key and val

    }

);

    });

Upvotes: 2

Related Questions