CODEWITHSUNDEEP
phpjqueryajaxjson
user2121620
user2121620

Reputation: 676

Ajax request not working with dataType "jsonp" or "json"

I'm trying to use JSON as a return type for an Ajax request (using jQuery) but my code always results in an error. I've tried changing the MIME type between json and jsonp but to no avail.

I'm also not sure if I'm formatting the data: part correctly. I understand that I need to wrap all of its information in a string for JSON, but I don't know if it's correct.

$.ajax({

    type: "POST",
    url: '-----',
    dataType: "jsonp",
    data: '{"jobtitle":"job"}',

    beforeSend:function(){ },


    success: function(data){
        var data = $.parseJSON(data);           

    },
    error: function(){
        alert("error with Ajax request");
    }

});

Edit: Here is my server-side code. I don't know how to return valid JSON from this.

<?php 


$jobtitle = $_POST["jobtitle"];
$city = $_POST["city"];
$state = $_POST["state"];



$url = "http://www.indeed.com/jobs?q=". $jobtitle ."&l=". $city ."%2C". $state;
$document = new DOMDocument;

$html = file_get_contents($url);
$document ->loadHTML($html);
$xpath= new DOMXPath($document);

$results = $xPath->query('//div[@id="searchCount"]');

$string = "";

if ($results){
    for ($i=0; $i < $results->length; $i++) {
            $node = $results->item($i)->textContent;


    }
    $exp = explode(" ", $node);

    print "Number of jobs: <b>".$exp[5]. "</b>";


}

Upvotes: 0

Views: 3137

Answers (4)

MonkeyZeus
MonkeyZeus

Reputation: 20747

Instead of:

print "Number of jobs: <b>".$exp[5]. "</b>";

You need to do this:

// send sexy JSON formatted string back to the AJAX call ;)
echo json_encode("Number of jobs: <b>".$exp[5]. "</b>");

To further make JSON useful implement and learn this snippet:

// send even sexier array formatted in JSON ;) ;)
echo json_encode(array('index1'=>'somevalue1','index2'=>'somevalue2','index3'=>'somevalue3','index4'=>'somevalue4'));

Also instead of:

dataType: "jsonp",

Try just json:

dataType: "json",

I think jsonp has something to do with cross-domain requests. I haven't had the pleasure of implementing JSONP yet but I think that's what it does :p

Also you can get rid of this:

var data = $.parseJSON(data);

And give this a whirl in it's place

console.log(data); // this is my best buddy

Upvotes: 0

Aditya
Aditya

Reputation: 4463

Why don't you try your ajax request like this:

$.post(url,{"jobtitle" : "job"},function(response) 
  { 
     console.log(response);  
 },'json').error(function()
      {
          alert("error with Ajax request");
      });

Upvotes: 0

UweB
UweB

Reputation: 4110

No matter what your server code is, you cannot simply call $.parseJSON(data). If the server actually returns JSONP, the format of data will be like

clientSideMethodName({ ... actual JSON data ... });

If your server returns JSON, you must a) specify that in your request through the dataType attribute or b) remove the attribute completely to have jQuery go guessing. jQuery is awesome so I think it would guess right corretly - and in either case, it would automatically call .parseJSON() for you, so your manual call would fail then too.

Upvotes: 0

Orangepill
Orangepill

Reputation: 24655

Take the single quotes out of this 

 data: '{"jobtitle":"job"}',

to make it 

 data: {"jobtitle":"job"},

Your datatype should probably be json. JSON with padding (jsonp) is for cross domain ajax(ish) requests.

and in your success callback data will be a json object not a json string so

 var data = $.parseJSON(data);

Is not needed.

Upvotes: 1

Related Questions