jQuery AJAX vs. XMLHttpRequest

Question

Searching for an answer for this question I got as a result that follwing code works fine:

xhr = new XMLHttpRequest();
xhr.onreadystatechange=function()
{
    if (xhr.readyState==4 && xhr.status==200)
    {
        response = JSON.parse(xhr.responseText);
        if(typeof response =='object') {
            $('#modal-spinner-seo-update').hide('slow');
            jQuery.each(result, function(field, message) {
                $('#seo-'+field).next('div.error-message').html(message).fadeIn('fast');
            });
        } else {
            $('#modal-spinner-seo-update').hide('slow', function() {
                $("#seo-widget-message-success").fadeIn('slow').delay(2000).fadeOut('slow');
            });
        }
        return false;
    }
};
xhr.open('GET','/metas/saveMetas?model='+model+'&f_key='+f_key+'&pagetitle='+pagetitle+'&keywords='+keywords+'&description='+description+'&niceurl='+niceurl, true );
xhr.send();

but this jQuery Version does not work. So can anyone spot the mistake? Is there any? The jQuery AJAX version works fine on my localhost but the server it does not, but return an 403 Forbidden Error. It is a cakePHP project.

So I hope someone ca tell me whats wrong or what setting is missing.

$.ajax({
    url: '/metas/saveMetas',
    data: {
        "model": model,
        "f_key": f_key,
        "pagetitle": pagetitle,
        "keywords": keywords,
        "description": description,
        "niceurl": niceurl
    },
    dataType: 'json',
    complete: function(){
        return false;
    },
    success: function(result) {
        if(typeof result =='object') {
            $('#modal-spinner-seo-update').hide('slow');
            jQuery.each(result, function(field, message) {
                $('#seo-'+field).next('div.error-message').html(message).fadeIn('fast');
            });
        } else {
            $('#modal-spinner-seo-update').hide('slow', function() {
                $("#seo-widget-message-success").fadeIn('slow').delay(2000).fadeOut('slow');
            });
        }
        return false;
    }
});

Answer 1

Something else to think about, in addition to the dataType:

Since it's returning a 403 error, have you added the 'saveMetas' method in the $this->Auth->allow() method in the beforeFilter() of 'MetasController' of your CakePHP project?

class MetasController extends AppController {
    public function beforeFilter() {
      parent::beforeFilter();
      $this->Auth->allow('saveMetas');
    }
    ...
    ...
}

EDIT:

Since you said you have done this, do you have $this->autoRender = false; and $this->layout = 'ajax'; as well in your saveMetas function?

Lastly, since you can visit that page directly, do a pr( $this->request ) after the initial function call and visit the page without AJAX to see what it is telling you. 403 forbidden tells me it's a permissions issue.