I have develop a Facebook app that use to fetch the data from the users using javascript API it will check the user is login or not if the user is not Login the app will give him a login button option and if he is already login he will see a form containing user's data
when user try to Login with login button a popup screen with username and password appears but after geting login the app does't refresh.
what i want is after getting login page need to refresh and form with his data should be appear
currently user get Login the screen get blank and user need to manually refresh the page then he see the form
<script>
function statusChangeCallback(response) {
console.log('statusChangeCallback');
console.log(response);
if (response.status === 'connected') {
document.getElementById('login').style.display = 'none';
testAPI();
} else if (response.status === 'not_authorized') {
document.getElementById('status').innerHTML = '<h1 style="color:white">Please log ' +
'into this app.</h1>';
document.getElementById('section').style.display = 'none';
} else {
document.getElementById('section').style.display = 'none';
document.getElementById('status').innerHTML = '<h1 style="color:white">Please log ' +
'into Facebook.</h1>';
}
}
function checkLoginState() {
FB.getLoginStatus(function(response) {
statusChangeCallback(response);
});
}
function logout() {
FB.logout(function(response) {
alert("Logout sccessfully");
});
}
window.fbAsyncInit = function() {
FB.init({
appId: '514432638688174',
cookie: true,
xfbml: true,
version: 'v2.1'
});
FB.getLoginStatus(function(response) {
statusChangeCallback(response);
});
};
(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s);
js.id = id;
js.src = "//connect.facebook.net/en_US/sdk.js";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
function testAPI() {
console.log('Welcome! Fetching your information.... ');
FB.api('/me', function(response) {
var idx = response.id;
idx = "https://graph.facebook.com/" + idx + "/picture?type=large";
document.getElementById('fname').value = response.name;
document.getElementById('femail').value = response.email;
document.getElementById('user').innerHTML = response.name;
document.getElementById('pp').style.backgroundImage = "url(" + idx + ")";
});