Render FBML in Facebook Dialog Popup

Question

I'm working on a facebook page where there is a table of profile images. Onclick for each of these images, I'm using a facebook dialog to show the name, a picture and a description in a popup.

The name is stored in the <img> name attribute. The description is stored in the <img> title attribute. The img src is stored in the <img> src attribute.

So onclick, all of this data is gathered from the image that was clicked on and should be spit out in a dialog.

The problem is I can't get the dialog to render FBML, it just shows it as plain text.

Here's a portion of the FBJS:

function showDialog(element) {
    var img_src = element.getFirstChild().getSrc();
    var name = element.getFirstChild().getName();
    var desc = element.getFirstChild().getTitle();
    var msg = '<img src="' + img_src + '" width="160" alt="' + name + '"> ' + desc;
    new Dialog().showMessage(name, msg);
}

and the FBML where the function is called:

<a href="#" onclick="showDialog(this);"><img src="http://mydomain.com/path/to/my/image.jpg" border="0" name="myName" title="My Description" width="160"></a>

For example, in this case the dialog would display the following plain text, rather than the rendered FBML I am trying to display:

<img src="http://mydomain.com/path/to/my/image.jpg" width="160" alt="myName"> My Description

How can I get the dialog to render FBML rather than just plain text?

Answer 1

The Facebook Developer Page says "title and content can be either strings or pre-rendered FBML blocks". I'm not really sure what is meant by "pre-rendered". It could be an <fb:js-string>. Unfortunately the fb:js-string does not work in static FBML pages due to a Facebook bug (I think).