jQuery facebook message add friends

I really appreciate facebook guys for making such a excellent UI.Whenever i see any new feature in facebook i get amazed “How did they made it?”.One day i saw a script for adding multiple recipients to messages and this script grabbed my attention like other scripts on facebook.In first look this script seem critical and innovative to me (may be because i was new to web development that time) but later on after long time i found that it was nothing but sight Cheating.i decided to make exact same script and I MADE IT.

I have made this with jquery,

Live Demo  Download

Implimentation Step By Step

• 1) INCLUDE JAVASCRIPT AND STYLESHEET

  1 2	<script src="js/jquery.js"></script> <script src="js/facebookStyleInput.js"></script>

• 2) CREATING WIREFRAME

  1	<link rel="stylesheet" type="text/css"href="styles/facebookStyleInput.css">

  add below text to your page

  1 2 3

  <div id="fb_holder"> <input type="text" name="friends" id="fb_inputbox"> </div>

  id=”fb_holder” can be anything you want. you can replace “fb_holder” with any other string.

• 3) ATTACH WIREFRAME TO JAVASCRIPT (INITIALISATION)

  1 2 3 4 5

  <script type="text/javascript"> var mainHolder   = "#fb_holder"; var inputBox     = "#fb_inputbox"; var ajaxFilePath = ""; </script>

  Assign whatever element names you have used in wireframe to the javascript variables.
  ajaxFilePath will hold path of file that will return matched list.if your file is in folder ajaxthen ajaxFilePath = “ajax/ajax_server.php”

• 4) DATABASE INSTALLATION

  a) In the same directory you should find files named facebook.sql and config.php.
  b) Import facebook.sql to Mysql.
  b) Open config.php file and make neccessary changes in it.

• 5) OTHER SETTINGS

  Make sure that ajax_server.php file resides in same directory where index.php file is,but if you want to change its location then you need to make change in configuration variable named ajaxFilePath enter full path of ajax_server.php file.

• 6) AND YOU ARE READY TO GO…!

  Source