My production site can be found here: http://infinite-brushlands-3960.herokuapp.com/
I have the javascript SDK set up as instructed here: https://developers.facebook.com/docs/javascript/quickstart/v2.5
When the user clicks "Share This Schedule", this code is run:
$('#share_schedule').click(function(){
if ($('#share_url_ul').children().length >= 1){
$('#share_url_ul').empty();
}
// Take care of no classes case "You cannot share an empty schedule."
$.ajax({
method: "POST",
url: "/share/",
data: JSON.stringify(localStorage),
contentType: "application/json; charset=utf-8",
dataType: "text",
success: function(response){
var shared_url = document.createElement('a');
$(shared_url).css('display', 'block');
$(shared_url).attr('href', window.location.href + 'shared/' + response);
$(shared_url).attr('id', 'share_link');
shared_url.innerHTML = window.location.href + 'shared/' + response;
$('#share_url_ul').append(shared_url);
$('#fb_share_btn').attr('data-href', window.location.href + 'shared/' + response);
},
error: function(error){
console.log(error);
}
});
});
But despite the line that sets the facebook button's data-href attribute to the url that I want to share (as described here https://developers.facebook.com/docs/plugins/share-button ), clicking the button still shares my home page to facebook instead of the link I specified there. Inspecting the button in the browser inspector show that it indeed has the correct url as the data-href attribute.
Why isn't the plugin sharing the correct url?
Since you are changing the button url on ajax load, you have to re-initialize the facebook share button after changing the attributes.
Try adding this to the end of success callback
FB.XFBML.parse();
So you should have something like
$('#share_schedule').click(function(){
if ($('#share_url_ul').children().length >= 1){
$('#share_url_ul').empty();
}
// Take care of no classes case "You cannot share an empty schedule."
$.ajax({
method: "POST",
url: "/share/",
data: JSON.stringify(localStorage),
contentType: "application/json; charset=utf-8",
dataType: "text",
success: function(response){
var shared_url = document.createElement('a');
$(shared_url).css('display', 'block');
$(shared_url).attr('href', window.location.href + 'shared/' + response);
$(shared_url).attr('id', 'share_link');
shared_url.innerHTML = window.location.href + 'shared/' + response;
$('#share_url_ul').append(shared_url);
$('#fb_share_btn').attr('data-href', window.location.href + 'shared/' + response);
FB.XFBML.parse();
},
error: function(error){
console.log(error);
}
});
});
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.