Skip to content

Instantly share code, notes, and snippets.

What would you like to do?
jQuery UI Autocomplete Facebook Friends
$(function() {
// Depends on: jQuery, jQuery UI core & widgets (for the autocomplete method)
// Assumes you're already including the FB JS SDK asynchronously...
window.fbAsyncInit = function() {
appId : 'xxxxxxxxxxxxxxxxxx', // App ID
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
oauth : true,
xfbml : true
FB.getLoginStatus(function (response) {
if (response.authResponse) { // if the user is authorized...
var accessToken = response.authResponse.accessToken
var tokenUrl = "" + accessToken + "&callback=?"
// Place <input id="name" /> and <input id="fbuid" /> into HTML
source: function(request, add) {
$this = $(this)
// Call out to the Graph API for the friends list
url: tokenUrl,
dataType: "jsonp",
success: function(results){
// Filter the results and return a label/value object array
var formatted = [];
for(var i = 0; i<; i++) {
if ([i].name.toLowerCase().indexOf($('#name').val().toLowerCase()) >= 0)
select: function(event, ui) {
// Fill in the input fields
// Prevent the value from being inserted in "#name"
return false;
minLength: 2

This comment has been minimized.

Copy link
Owner Author

@aarongrando aarongrando commented Jan 18, 2012


This comment has been minimized.

Copy link

@rohankshir rohankshir commented Mar 19, 2013

can you please include an example of how this would be used with the html input form?
I tried doing this and added the two and in a html page. However, nothing happens when I type anything into the name input box. I monitored the http requests and found that no requests go out while I'm typing anything in.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment