santiagoIT
santiagoIT

Reputation: 9431

calling $.ajax without having my canvas page being redirected to post url

I want to submit a form from my Facebook canvas app via ajax. If I run my app outside of facebook, it works fine. However, if I do the ajax call running as a Facebook canvas app, the user is redirected to the the ajax post url! The server response is valid json.

I've spent over an hour on this. I found that Facebook has a deprecated FBJS ajax api. The new js api does not provide any ajax functionallity. The documentation on the deprecated API listed above states:

If you are building a new app on Facebook.com, please implement your app using HTML, JavaScript and CSS.

What is the magic recipe to make an ajax post from a canvas app?

The relevant code boils down to this:

$(function () {
    $('form').submit(function () {
        if ($(this).valid()) {
            $.ajax({
                url: this.action, // I tried also submitting to the apps.facebook.com/... url, but it made no difference
                type: this.method,
                data: $(this).serialize(),
                success: function (result) {
                    $('#result').html(result);
                    alert('TESTING - WORKS!!');
                }
            });
        }
        return false;
    });
});

Upvotes: 0

Views: 320

Answers (1)

santiagoIT
santiagoIT

Reputation: 9431

A night's sleep does wonders to your mind. It was very late yesterday when I posted this question. When I woke up this morning I knew what to check for. The action I was posting to via ajax was in a controller that required Facebook authentication... Moved the action to a different controller and it now works. solved

Upvotes: 1

Related Questions