Facebook share custom story on my timeline using javascript sdk

Question

This is a very novice question that i am not able to find a solution to i have spent a lot of time in reading their official documentation but it's all in vain, so i have come here as a last resort.
What i am trying to do
I want to post my custom story on my timeline,
1)I have created a custom story
2)have tried to share it with a share dialog[did not work], and have tried the api call also.

<div id="fb-root"></div>

<!-- facebook code starts here -->

<script>
  function statusChangeCallback(response) {
    console.log('statusChangeCallback');
    console.log(response);


  function checkLoginState() {
    FB.getLoginStatus(function(response) {
      statusChangeCallback(response);
    });
  }

  window.fbAsyncInit = function() {
  FB.init({
    appId      : xxxxx[correctly used app id],
    cookie     : true,  // enable cookies to allow the server to access 
    status     : true,           
    xfbml      : true,  // parse social plugins on this page
    version    : 'v2.0' // use version 2.0
  });



  FB.getLoginStatus(function(response) {
    statusChangeCallback(response);
  });




  FB.api(
          'me/objects/restaurant.restaurant',
          'post',
          {
            app_id: xxxxx[correctly used app id],
            type: "restaurant.restaurant",
            url: "http://samples.ogp.me/440002909390231",
            title: "Sample Restaurant",
           image:"https://static.ak.fbcdn.net/images/devsite/attachment_blank.png",
            description: "This place rocks",
            contact_info: "http://www.facebook.com",
            location: "-122.148283"
          },
          function(response) {
            // handle the response
          }
    );


  FB.api(
          'me/testxdev:eat',
          'post',
          {
            restaurant: "http://samples.ogp.me/440002909390231"
          },
          function(response) {
            // handle the response
          }
        );


  };//********END OF FUNCTION ENCLOSING INIT()***********

  // Load the SDK asynchronously
  (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/debug.js";
    fjs.parentNode.insertBefore(js, fjs);
  }(document, 'script', 'facebook-jssdk'));


</script>  

 <div class="fb-like" data-send="true" data-width="450" data-show-faces="true"></div>


<!--  End of facebook code-->

Answer 1

I was able to solve my own question, I have also posted the solution so that others will not have such a hard time.

<div id="fb-root"></div>
<!-- facebook code starts here -->

<script>

  function statusChangeCallback(response) {


    if (response.status === 'connected') {



     FB.api('/me', function(response) {
        console.log("here");
            console.log(JSON.stringify(response));
});  

  FB.api(
         '/me/objects/restaurant.restaurant',
         'post',
         {
           app_id: "[your app id]",
           type: "restaurant.restaurant",
           url: "http://samples.ogp.me/440002909390231",
           title: "Sample Restaurant",
           image: "https://s-static.ak.fbcdn.net/images/devsite/attachment_blank.png",
           description: "This place rocks",
           contact_info: "http://www.facebook.com",
           location: "-122.148283"
         },
         function(response) {
           // handle the response[this helped a lot]
           console.log(JSON.stringify(response));

         }
        ); 

          FB.api(
              '/me/testxdev:eat',
              'post',
              {
            restaurant: "http://samples.ogp.me/440002909390231"
              },
              function(response) {
            // handle the response
              console.log("the action response "+response);
               console.log(JSON.stringify(response));

              }
           );

    } else if (response.status === 'not_authorized') {
      document.getElementById('status').innerHTML = 'Please log ' +
        'into this app.';
    } else {
      document.getElementById('status').innerHTML = 'Please log ' +
        'into Facebook.';
    }
  }


  function checkLoginState() {
    FB.getLoginStatus(function(response) {
      statusChangeCallback(response);
    });
  }

  window.fbAsyncInit = function() {
  FB.init({
    appId      : "[your app id]",
    cookie     : true,  
    status     : true,     
    xfbml      : true,  
    version    : 'v2.0' 
  });

  FB.getLoginStatus(function(response) {
     statusChangeCallback(response);   
  });



  };

  // Load the SDK asynchronously
  (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/debug.js";
    fjs.parentNode.insertBefore(js, fjs);
  }(document, 'script', 'facebook-jssdk'));


</script>


<fb:login-button scope="public_profile,email,publish_actions",
    auth_type: 'rerequest' onlogin="checkLoginState();">
</fb:login-button>
<div id="status"></div>
 <div class="fb-like" data-send="true" data-width="450" data-show-faces="true"></div>


<!--  End of facebook code-->

The above code is working properly[the code is from a custom created story], the main issue was that by default when the post is shared it DOES NOT APPEAR ON THE TIMELINE[AS THE APP IS IN DEVELOPMENT MODE], hence to view the post go to view recent activity log. it must be visible there. If you want the post to appear on the timeline set the app visibility under the status and review in the app dashboard to yes

as of 2014 if you want to post anything to the user[apart from the app registered developer] timeline you need Facebook permission ie the app needs to be submitted for approval Please refer the following link https://developers.facebook.com/docs/facebook-login/permissions/v2.0

you can check that it's right below the overview section.