Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Search Facebook Friends with jQuery
<script>
$(function() {
$( "#autocomplete-input" ).autocomplete({
source: function( request, response ) {
$.ajax({
url: "https://graph.facebook.com/me/friends?access_token=AAAAAAITEghMBAMDBQ94HP7mX7JoDeCS6JVhN19bC4mXSvGdAglokKNC2hUYcc1uOHTZBXtWvxhxIYU7ZCVCXKxnw46nISYSFfTO26QRQZDZD&callback=?",
dataType: "jsonp",
data: {
featureClass: "P",
style: "full",
maxRows: 12,
name_startsWith: request.term
},
success: function( data ) {
res = $.map( data.data, function( item ) {
if (item.name.toLowerCase().indexOf(request.term.toLowerCase()) >= 0){
return {
label: item.name,
value: item.id
}
}
});
response(res);
}
});
},
minLength: 0,
select: function( event, ui ) {
// log( ui.item ?
// "Selected: " + ui.item.label :
// "Nothing selected, input was " + this.value);
},
open: function() {
$( this ).removeClass( "ui-corner-all" ).addClass( "ui-corner-top" );
},
close: function() {
$( this ).removeClass( "ui-corner-top" ).addClass( "ui-corner-all" );
}
});
$("#autocomplete-input").data("autocomplete")._renderItem = function( ul, item ) {
console.log(item);
var image_url = "http://graph.facebook.com/" + item.value +"/picture";
return $( "<li>" )
.append($("<img style='float:left'>").attr('src',image_url))
.append( $( "<a>" ).text( item.label ) )
.appendTo( ul );
}
});
</script>
</head>
<body></body>
<input id="autocomplete-input" />
</body>
@vanessahernandez
Copy link

vanessahernandez commented Jul 6, 2012

we are changing the access token (line 6) to our own?

@anativ
Copy link
Author

anativ commented Jul 6, 2012

Yes

@vanessahernandez
Copy link

vanessahernandez commented Jul 6, 2012

i have this error (firefly) TypeError: $("#autocomplete-input").autocomplete is not a function

@Peter-Hudson
Copy link

Peter-Hudson commented Feb 7, 2013

If you are getting the error autocomplete is not a function you need to download the jQuery autocomplete plugin - http://jqueryui.com/autocomplete/

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