Search code examples
jquery-mobilecordovacross-domainjsonp

Phonegap Jquery mobile cross domain ajax request not working


I am trying to make a ajax request from my phonegap app to a serverside code written in php which is on my localhost. I am trying to use the jsonp request. This is my code

        $.ajax({
            url: 'http://localhost/score-tracker/get-groups.php',
            type: 'GET',
            contentType: "application/json",
            async: true,
            dataType: 'jsonp',
            crossDomain: true,
            success: function(resp){},
            error: function(err) {}
        });

But the control does not return either in error or success callbacks. I even have this enabled :

$.support.cors = true;
$.mobile.allowCrossDomainPages = true;

WHen i check the request in chrome console, I find the status as "failed" and type as "pending"

This is my server side code :

require_once('AddGroup.php');
header('content-type: application/json; charset=utf-8');
header('Access-Control-Allow-Origin: *');
$a = json_encode(array('a' => 1, 'b' => 2));
echo $_REQUEST['callback'].'('.$a.')';

Please help me. I am really stuck with this.

Thank you


Solution

  • I got the problem solved. Just posting the answer if any one finds it helpful

    $.ajax({
            url: 'http://<ip>/score-tracker/get-groups.php',
            type: 'GET',
            contentType: "application/json",
            async: true,
            dataType: 'jsonp',
            crossDomain: true,
            success: function(resp){},
            error: function(err) {}
        });
    

    And in the http.d conf file of apache I had permission denied to the www directoy for which I was getting the forbidden error. I allowed access to that directory and the problem was solved.