O'Reilly logo

Facebook Cookbook by Jay Goldman

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

You Can Pick Your Friends (in Batches)

Problem

I need to give my users the ability to pick a bunch of friends at the same time. How can I give them a text field that will filter their friend list as they type?

Solution

Use the fb:multi-friend-input tag. The simplest form is:

<form name="some_form" action="http://apps.facebook.com/myapp/
handle.php" method="post">
    <fb:multi-friend-input />
    <input type="submit" value="Send it!"/>
</form>

It’s hard to get much simpler than that! This is a great example of FBML saving you a huge amount of work. That piece of code will give you a simple text box shown in Figure 6-47.

multi-friend-input box

Figure 6-47. multi-friend-input box

When users put focus into the field, they’ll get some instructions, as shown in Figure 6-48.

multi-friend-input with instructions

Figure 6-48. multi-friend-input with instructions

As they start typing a name, Facebook will display a list of matching friends below the field (Figure 6-49).

multi-friend-input with prediction

Figure 6-49. multi-friend-input with prediction

So far, this looks a lot like the fb:friend-selector tag covered in You Can Pick Your Friends. The difference is in what happens after the user picks her first friend—in this case, she can keep adding more and more friends to the field, as you can see in Figure 6-50 ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required