I'm using the Facebook Send Dialog to send messages to friends. As documented here: https://developers.facebook.com/docs/reference/dialogs/send/ and am using a link like the one in Facebook's example:
https://www.facebook.com/dialog/send?app_id=123050457758183&name=People%20Argue%20Just%20to%20Win&link=http://www.nytimes.com/2011/06/15/arts/people-argue-just-to-win-scholars-assert.html&redirect_uri=http://www.example.com/response
On the page I have specified as the redirect_uri I am displaying text saying: "Your message has been sent". However I've realised that you see this page even if you've clicked cancel in the Facebook dialog.
Is there any way to determine whether save or cancel has been clicked?
Update: I've found a workaround using the FB.ui method which solves the immediate issue I was having. I would still be interested to know if anyone has a better solution using a Send Dialog link like the one above.
I've found a work around by using Facebook's Javascript SDK's FB.ui method.
FB.ui({
method: 'send',
name: 'People Argue Just to Win',
link: 'http://www.nytimes.com/2011/06/15/arts/people-argue-just-to-win-scholars-assert.html,
display: 'popup'
});
N.B. display must be set to popup for this to work!
As it does not require a redirect_uri, the issue of knowing whether save or cancel has been clicked is not an issue. If however you do wish to know this, you can access a response object:
FB.ui({
method: 'send',
name: 'People Argue Just to Win',
link: 'http://www.nytimes.com/2011/06/15/arts/people-argue-just-to-win-scholars-assert.html,
display: 'popup'
},
function(response) {
if (response){
// save has been clicked
} else {
// cancel has been clicked
}
});
Small complement to Andy's response:
the response-object does not give much info about what has been sent, actually (returns [] in console), but the mere EXISTENCE of the reponse object indicates the "SEND" button has been pressed
FB.ui(obj, function (param) {
if (param) {
// The "SEND" button has been pressed
}
else{
// The "Cancel" button has been pressed
}
Related
I'm using the below code to show a dnnConfirm confirmation popup before proceeding. The issue is that it requires two clicks to show. And when I close it and click the button again it needs 3 clicks and so on and so forth.
I'm new to DNN any idea what must be wrong here. Please guide
This is my hyperlink button:
<a id="link-btn" class="dnnSecondaryAction" onclick="setInfo();"/>Save Info</a>
This is my confirmation code:
$("#link-btn").dnnConfirm({
text: "<div class='MS'>Save info?</div>",
title: "Confirm Save",
yesText: 'Yes',
noText: 'No',
isButton: true
});
//handle user decision
$("#link-btn").click(function (e, isYES) {
if (isYES) {
saveUserInfo(userID);
}
return false;
});
There are a couple of issues here that could be causing problems for you.
Unfortunately, you didn't include code for the setInfo() method but I'd look there first. E.g. Is this method returning false?
Another issue could be returning false from
$("#link-btn").click(function (e, isYES) {
which could be short circuiting some other desired behavior. In general, you're better off using:
e.preventDefault();
instead.
I would also note that $("#link-btn").click() probably doesn't do what you think it does. Rather than handle the results of the confirm dialog, this is fired when the confirm dialog is launched. (e.g. #link-btn is clicked)
To address the potential causes for your two-click-show problem (and to also be able to handle the results of your confirm dialog) I'd recommend rewriting as follows:
Hyperlink
<a id="link-btn" class="dnnSecondaryAction"/>Save Info</a>
Javascript
$("#link-btn").dnnConfirm({
text: "<div class='MS'>Save info?</div>",
title: "Confirm Save",
yesText: 'Yes',
noText: 'No',
isButton: true,
callbackTrue: function() {
saveUserInfo(userID); // assuming userID is a global
}
});
$("#link-btn").click(function (e) {
setInfo();
// in this case, you don't need to call e.preventDefault()
// as dnnConfirm will handle that for you
});
I have a form where people can delete records;
Delete Record 1
Delete Record 2
Delete Record 3
To ensure they are sure, I am using a "Are you sure" confirmation script (Popconfirm) which gives a nice little popup confirmation.
$(".confirm-action").popConfirm();
If the user clicks cancel, nothing happens. If they click 'yes' - the link is processed and the record deleted. This is working as intended.
Now instead of following the link (when the user clicks 'yes'), I want to fire an ajax request:
$('.confirm-action').click(function(event) {
event.preventDefault();
$.ajax({
// Ajax stuff here
});
});
$(".confirm-action").popConfirm();
The problem is when I try this, the functions are fired in the correct order when expected, except the event is null, so the script fails.
How do I "preventDefault()" when the event is null, and/or manually get the event to prevent the link from being followed by the browser?
Edit: JSFiddle showing the problem.
As noted in the comments, the plugin is horrible and plays with _data(events) IE plays with internal event management of jQuery.
If you aren't concerned about the UI, I would suggest you to go with normal confirm() as used in SO.
I've created this for you while typing this answer:
$.fn.nativeConfirm = function (options) {
return this.click(function () {
var bool = confirm(options.text);
bool ? options.yes.call(this) : options.no.call(this);
});
}
Example:
$('a').nativeConfirm({
yes: function(){
alert('yes');
},
no:function(){
alert('no');
},
text: 'Seriously?'
});
After loading FB UI this is my Code:
<div class="fb-send" data-href="https://www.gmx.de" data-colorscheme="light"></div>
Now I want to add 2 different users (prefilled in the dialog).
There is code like this:
FB.ui({
method: "send",
link: "http://www.google.com/",
to: ["zuck","dmp"]
},
function(response) { alert(response); }
);
But how can I connect the Facebook-Button with this code?!
You are using Send Button and Send Dialog both- which isnt required! Both do almost the same thing.
I think you thought that you could pre-fill the recipients using the to parameter - that's right BUT you cannot add more than one recipient. You can use to with one user-id only.
On click of a button / html element- call FB.ui method, this will open the send dialog.
//Update:
With help I managed to catch some errors which fixed the token issue. I've updated the code to reflect that. The code still doesn't produce an event on the timeline though so I'm leaving the question up.
Original question:
I'm trying to build a simple script using the Open Graph API that will push a link to a visited page (containing a movie) to Facebook, once the visitor hits the page.
I'm not using a custom action and object, but the standard Watch action (https://developers.facebook.com/docs/opengraph/video/) and Video.movie object.
I came up with this based on FB's example code:
<!-- first login-button with scope publish_actions: -->
<fb:login-button show-faces="false" width="200" max-rows="1" scope="publish_actions" ></fb:login-button>
<!-- Then script that should push update to timeline: -->
<script type="text/javascript">
function fbPublish(){
FB.api(
'/me/video.watches',
'post',
{ 'video.movie': '<?php the_permalink(); ?>',
'access_token': 'blablabla' },
function(response) {
if (!response || response.error) {
alert('Nope.');
} else {
alert('Yes.'); // any stuff
}
});
}
This triggers the alert 'Nope'.
I have added the Watch action through curl.
Any ideas as to what could be going on?
You still need to FB.login before you can automatically post to the user's timeline.
FB.login(function(response) {
// Post the action
}, {scope: 'publish_actions'});
While I didn't check the validity of your actual code to post the action, you problem is that before you can do this, you'll need the user's permission. The publish_actions permission is the one you'll need but I think its already included in new Auth Dialogs. Just leave it there to be sure.
Do the FB.login code first, you'll get a popup "Allow" dialog, after that, is the time you can freely post in the user's wall. It's a part of the security, Facebook users wouldnt want you posting on their timeline without them knowing.
My app opens a share dialog when the user submits a form. The dialog is called on document ready (jQuery) when the page refreshes after the submit.
The dialog box does open, but then closes a couple of second later. This pretty much renders the dialog useless. If you try and hit 'share' before it closes then it does work, but obviously most users aren't going to try and race it.
The app can be found here: https://apps.facebook.com/topmoviesseen/
I have noticed that it can be tempremental, with the odd time seeing it work perfectly. Other times the dialog disappears only to reappear 4 or 5 seconds later. I would hazard a guess that there is some sort of JS affecting either the z-index or visibility of the box, but I cannot find anything.
Any help is hugely appreciated.
Code used to call dialog:
$(document).ready(function(){
// calling the API ...
var obj = {
method: 'feed',
display: 'iframe',
access_token: 'example',
name: 'Top 100 Movies Seen',
link: 'https://apps.facebook.com/topmoviesseen/',
picture: 'https://mgnewmedia.com/topmovies/assets/images/for_stream.png',
description: 'I have seen 62 of the top 100 movies of all time. How many have you seen?',
caption: 'Done any better?',
message: '62 out of 100 isn\'t bad.'
};
FB.ui(obj, callback);
});
you have to make sure your FB.ui is called after your FB.init is complete, so setting it in the window.fbAsycncInit listener will help:
window.fbAsyncInit = function() {
FB.ui(...)
};