How to make facebook friends search using jQuery & PHP

It's only fair to share...Share on Facebook0Share on Google+0Tweet about this on Twitter0Share on LinkedIn0Pin on Pinterest1Digg thisShare on StumbleUpon4

Facebook used a nice user interface for friend search in friends listing page. Here we are using jQuery to make Facebook friends live search. This script can be integrated easily and can be used for any type of search like products, news etc.

We are using very simple jQuery script, just few line of code and its work. Using jQuery we are getting the user input from the search box and checking that value against our friends list in the “fb-friends-list” div class. We are using RegExp to perform case insensitive search.

Facebook Search

jQuery Code:

 CSS Code:

 HTML & PHP Code:

 NOTE: We have created an array with name as key and profile image as value. Here you can use database for the friend records.

Leave a Reply

Your email address will not be published. Required fields are marked *


You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code class="" title="" data-url=""> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> <pre class="" title="" data-url=""> <span class="" title="" data-url="">