Facebook Cookbook

Using FBML Inside FBJS

Problem

I have a whole big function working perfectly in FBJS, but now I want to use some FBML as an output inside of it. Putting the FBML into the FBJS directly doesn’t work, so how can I get it in there?

Solution

Use the fb:js-string tag. The simplest form is:

<fb:js-string var="myName">
    <fb:name uid="561415460" linked="false" useyou="false" />
</fb:js-string>

Any FBML you put inside the fb:js-string tag will become available in the FBJS on your page as the variable named in var (in this case, I’d now have a variable in my FBJS called myName with the value “Jay Goldman”).

Discussion

This tag comes in handy when you want to do things like display a bunch of content or a number of options inside something like a dialog (see Dialogs That Pop) using FBJS:

<fb:js-string var="iceCreams">
    <p>What's your favorite ice cream flavor?</p>
    <select id="iceCreamSelector">
        <option value="" selected="selected">(Pick a flavor!)</option>
        <option value="chocolate">Chocolate</option>
        <option value="vanilla">Vanilla</option>
        <option value="strawberry">Strawberry</option>
        <option value="moosetracks">Moose Tracks</option>
    </select>
</fb:js-string>

<script type="text/javascript">
<!--
    var myDialog = new Dialog(Dialog.DIALOG_POP);

    myDialog.showChoice('Ice Cream', iceCreams, button_confirm='Mmmm!',
        button_confirm='Ewww!');
-->
</script>

That will give you something like Figure 6-51.

Figure 6-51. FBJS ...