Online Book Reader

Home Category

Facebook Cookbook - Jay Goldman [88]

By Root 772 0
/>

will give you Figure 6-53.

Figure 6-53. fb:dialog-content with a form

NOTE

You can take advantage of Facebook’s Mock Ajax to do form submission and return from inside of your fb:dialog. See Dialogs with Ajax for more information.

The fb:dialog-title tag needs no further explanation, other than to note that you can format the content with HTML tags such as strong and em, and by applying CSS:

I Scream!

You Scream!

We All Scream!

The fb:dialog-button tag, on the other hand, does need some explanation because it has a few optional parameters, listed in Table 6-20.

Table 6-20. Parameters for fb:dialog-button

Name

Type

Default value

Description

type

string

N/A

The type of button to render. Can be either button for a generic button or submit for a form submitter (make sure to include a form_id for a submit button). This is required.

value

string

N/A

The text to put on the button. This is required.

close_dialog

bool

false

Specifying true will close the dialog when this button is clicked.

href

string

N/A

The URL to take users to when they click on the button. Can be external to Facebook.

form_id

string

N/A

If this button submits a form, you need to specify the form’s id here (e.g.,

).

clickrewriteurl

string

N/A

If you’re using Mock Ajax with this dialog, you need to specify the URL from which Facebook will retrieve your response. See Dialogs with Ajax.

clickrewriteid

string

N/A

If you’re using Mock Ajax with this dialog, you need to specify the id of the element that will be replaced with the response when it comes back (typically the id of the fb:dialog this button is in so that the whole dialog gets replaced, but it could be a div within it). See Dialogs with Ajax.

clickrewriteform

string

N/A

If you’re using Mock Ajax with this dialog, you need to specify the id of the form whose values this button will submit to the URL specified in clickrewriteurl. See Dialogs with Ajax.

Dialogs in Context


Problem


Sometimes I want a dialog, but I don’t really want it to pop up over everything else. Can I attach it to something on my Canvas page?

Solution and Discussion


The fb:dialog FBML tag won’t give you the power you want, but you can definitely do this with FBJS. See Displaying Contextual Dialogs.

Dialogs with Ajax


Problem


I have an fb:dialog with a form in it, which I’d like to submit to my server and have the result displayed back in my fb:dialog.

Solution


Facebook’s Mock Ajax is perfect for this kind of application, taking a lot of the pain out of doing things such as dynamic form submission without having to reload the page. The setup is pretty simple, requiring an fb:dialog, a trigger control, and a response page. Let’s start with the fb:dialog, which can be defined anywhere in your FBML (or in an included file if you’re going to use it in a few places throughout your app):

I Scream! You Scream! We All Scream!

What's your favorite flavor?

type="submit"

value="For Ice Cream!"

clickrewriteurl="http://www.someserver.com/ice_cream_maker.php"

clickrewriteid="ice_cream_image"

clickrewriteform="ice_cream_flavors"/>

NOTE

Some of you out there in reader land are inevitably going to read this example and say, “Moose Tracks!? He’s just making this stuff up.” I pity you. Go out to your nearest vendor of frozen treats and demand a big waffle cone of Denali Original Moose Tracks® and eat the whole

Return Main Page Previous Page Next Page

®Online Book Reader