CSS jQuery

Facebook like live search using jquery

This is simple and most useful script inspired by facebook friends live search script. Live search script can definitely help you create a interactive user experience. I have already posted few tutorials about creating better UI experience. Live search using jquery script can be integrated easily on any page where you are listing products, user profiles, news, blog posts etc.
Simple html layout.
This could be made simple using tables but by using tables you couldnt achieve smooth animation effect so here we will be using div (Actually, I prefer designing using divs only, that makes me perfect every-time i design new script as well as users get the best).
There is nothing rocket science like in jquery part, The most important part of the script is in just one line which is
The “i” in the RegExp performs case insensitive search. Remaining part is common to other jquery codes. have a look.

9 Comments

  • Can this be used to search an entire database or does it just text on that specific page? Great tutorial and thanks for sharing.

    • Actually its a javascript based search so it will work only on local machines, witch means you cant use it to search the data in database.

  • Hey Amit,

    I’m new to programming, pardon me if this sounds trivial but could sometimes its a bit difficult to follow along with your tutorials. Don’t get me wrong, your explanations are clear and concise.

    The problem is, some of us can’t figure out how exactly the lines of codes piece together in (their respective files), and thus we can’t come up with fully functional implementations of this tutorial.

    I would like to experience the joy of actually hacking it & seeing it work on my localhost. That being said, it would mean a lot if you could provide the files for download.

    Regards.

  • Hey Amit

    I was watching your work and is pretty good, I like it a lot.

    I would like to ask you with this live search, can we do it for our database?

    I know your code is on java and only for the localhost, but I would like to ask if we can do it for the database

    Kind regards

    • There are 2 ways if you have less records you can fetch all of them and then use same script and second is, if you have large number of records then you can use ajax search which will little slower compared to this script.

Leave a Comment

*

Notify me of followup comments via e-mail. You can also subscribe without commenting.

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Shares

Let your friends know what are you reading

Share this post with your friends!