invite friends in a dialog in a Facebook application
I'm trying to create a Facebook application that displays a friend invite dialog within the application using Facebook's Javascript API (FB.ui).
To do that I followed this tutorial
I have two problems:
- The action url I've put in the request-form is "http://apps.facebook.com/appname/post_invite.php"
but I see that the iframe source after the post is "http://example.com/post_invite.php"
and when this iframe tries to do:
parent.closeInviteWidget();
I get an error saying:
"Permission denied for < http://example.com > (document.domain has not been set) to get property Window.closeInviteWidget from < http://apps.facebook.com> (document.domain=< http://facebook.com>)."
- The skip button inside the request-form opens the action url in a new window (new browser tab) and not post to itself like the invite button.
How can I fix those problems?
-------------------- UPDATE : --------------------------------
I've tried to do what ifaour said and changed the code to:
function inviteFriends(user_name, category_id, category_name)
{
url = appBaseUrl + "/index.php?category_id=" + category_id;
req = "<fb:req-choice url='" + url + "' label='Authorize My Application' />";
content = user_name + " opened a new category called " + category_name + ". " + req;
action = 'post_invite.php';
fbmi_text = '<fb:request-form action="' + action + '" target="_self" method="post" invite="true" type="Invite" content="' + content + '" <fb:multi-friend-selector showborder="false" actiontext="Invite yor friends" email_invite="false" import_external_friends="false" /> </fb:request-form>';
FB.ui({
method:'fbml.dialog',
width:'750px',
fbml:fbmi_text
});
}
When I use FireBug and look at the invite form it looks like this:
<form id="req_form_4d20682f73ddb6e71722794" content="I've opened a new category called dsfsd. <fb:req-choice url='http://apps.facebook.com/appname/index.php?category_id=60' label='Authorize My Application' /> type="Invite" invite="true" method="post" target="_self" action="http://apps.facebook.com/appname/post_invite.php">
...
</form>
But I still get the same error:
Permission denied for http://example.com (document.domain has not been set) to get property Window.closeInviteWidget from http://apps.facebook.com (document.domain=http://facebook.com)...
This are my app settings (I've added spaces because I can't add more links):
Site URL : http://appname.example.com/
Canvas Page : http://apps.facebook.com/appname/
Canvas URL : http://appname.example.com/
Canvas FBML/iframe : iframe
Post-Authorize Redirect URL : http://apps.facebook.com/appname/
Please have a read of the official Facebook document.
Also try using action="http://appname.mydomain.com/post_invite.php".
EDIT: I've just realized! are you using IFrame or FBML as canvas type?!
If you are using IFrame then fb:serverFbml is needed to use FBML within your IFrame.
Also please note that FBML will be deprecated:
We are in the process of deprecating FBML. If you are building a new application on Facebook.com, please implement your application using HTML, JavaScript and CSS. You can use our JavaScript SDK and Social Plugins to embedded many of the same social features available in FBML. While there is still functionality that we have not ported over yet, we are no longer adding new features to FBML.