• Choose a category
• All
• Classic-Fiction

By Root 640 0

red), and the third div toggles the greenDiv class to off so that it disappears (and we get a pop-up Facebook dialog to let us know it’s not green anymore).

Figure 7-2. After clicking “Ouch!”

Dynamically Setting Content

Problem

Now I want to set the contents of an element on my page programmatically.

Solution

Facebook Platform makes two methods available to you:

obj.setInnerFBML(newContent)

Similar to using obj.innerHTML = newContent in traditional JavaScript, but with a few differences. Note that actually passing a string instead of a variable will usually cause a JavaScript error (fbjs_private.get(fbml_ref) has no properties), so you should instead use the FMBL tag on your page to define an FBJS string that you can pass instead (i.e., wrap the content in opening and closing tags). Also, note that setInnerFBML() will replace all of the existing children of obj in the same way that setting innerHTML() will.

obj.setTextValue(newContent)

Sets the text displayed within an object but will not accept FBML or HTML. This is really useful for doing things such as status updates, where you don’t really need anything beyond a text update, especially if you’re setting the text value of a div with a class applied for formatting (e.g.,

).

Discussion

Setting text values is pretty self-evident, but setInnerFBML needs a little bit more explanation, mostly because of the weirdness around passing a string versus setting up a JavaScript string.

If you’ve read the chapter on FBML (Chapter 6), you’ll know that a lot of the power of building on Facebook Platform comes from the ease of throwing in tags that display user interface widgets and a lot of content. It’s much easier to toss in a than it is to use the PHP API to extract the person’s name and output it. It’s also way simpler to drop in an block than it is to build your own from scratch, and these blocks have the added benefit of being Platform-native. You could build your FBML as a string literal in your function call to setInnerFBML, but odds are that you’ll end up having to untangle a whole bunch of nested quote characters that will need to be properly escaped, and you’ll end up with one long line of rendered HTML instead of your meticulously formatted and easily readable version. Do this instead:

action="index.php"

method="POST"

invite="true"

type="Your App"

content="Your text goes here.">

showborder="false"

actiontext="Invite your friends!">

Textbox Selections

Problem

I need to get or set the selection (or contents) of a textarea or an input of type text.

Solution

Facebook Platform provides a pair of methods for getting and setting the selection in text fields:

obj.getSelection()

Returns an object with start and end properties:

selIndexes = document.getElementById('myTextarea').getSelection();

selStart = selIndexes.start;

selEnd = selIndexes.end;

obj.setSelection()

Sets the selection within the text field, taking a required start and an optional end:

// Put the cursor into the field after the 5th character

document.getElementById('myTextarea).setSelection(5);

// Select the 5th to 10th characters

document.getElementById('myTextarea).setSelection(5,10);

Discussion

This isn’t much different from the way you would access the same properties through normal JavaScript, except than an abstraction layer has been added to smooth over Internet Explorer’s lack of support for selectionStart and selectionEnd. The Fabulous Selection Getter and Setter twins