Question

SOLVED:

The problem lies within Firefox 6.0.2 security.
I have changed my URL request from:
http://mysite.com/ajax/request
to /ajax/request
and Its working.

If you need to use cross domains, you need to use jsonp as your dataType.

Many thanks to evildead

---

My JSON request to my server returns an empty response.
This only happens in Firefox 6.0.2 and Safari in a Windows Vista machine.

The output is generated by a php script and has json/application headers.

This returns empty response:

    $('#ajaxcall').click(function(){
var ts = new Date().getTime();
var urlz = $('#targeturl').val()+'/'+ts;
var dataString = $("#datazz").val();
$.ajax({  
    type: "POST", url: urlz, data: "data="+dataString, 
    success: function(data){  
        var obj = jQuery.parseJSON(data);

        for (var i = 0; i < obj.length; i++) {
            var object = obj[i];
            for (property in object) {
            var s = property + "=" + object[property] + "<br>";
                $("#console").after(s);
            }
        }
    }  
});
});

As well as this:

$( "#tags" ).autocomplete({
        source: function( request, response ) {
            $.post("http://mysite.com/v2/ajax/tag_suggestion/ab", {data:request.term}, function(data){
                response($.map(data, function(item) {

                if ($('#tagsboxvals').hasClass(item.name.split(' ').join('_'))){
                return null;

                } else {
                return {
                    label: item.name,
                    value: item.name
                }
                }
                }))
            }, "json");
            },
            ....
});

Thanks for your help

Edit: This is what the PHP script is generating:

$arr = array(
    array('name'=>'pizza', 'point'=>'1'),
    array('name'=>'blt', 'point'=>'1'));

    header('Cache-Control: no-cache, must-revalidate');
    header('Expires: Mon, 26 Jul 1997 05:00:00 GMT');
    header('Content-type: application/json');
    echo json_encode($arr);

It’s a well formed JSON document.

Headers:
Response Headers
Date Wed, 07 Sep 2011 23:58:42 GMT
Server Apache/2.2.3 (CentOS)
X-Powered-By PHP/5.1.6
Expires Mon, 26 Jul 1997 05:00:00 GMT
Cache-Control no-cache, must-revalidate
Pragma no-cache
Content-Length 29
Connection close
Content-Type application/json
Request Headers
Host mysite.com
User-Agent Mozilla/5.0 (Macintosh; Intel Mac OS X 10.7; rv:6.0) Gecko/20100101 Firefox/6.0
Accept application/json, text/javascript, /; q=0.01
Accept-Language en-us,en;q=0.5
Accept-Encoding gzip, deflate
Accept-Charset ISO-8859-1,utf-8;q=0.7,*;q=0.7
Connection keep-alive
Content-Type application/x-www-form-urlencoded; charset=UTF-8
X-Requested-With XMLHttpRequest
Referer http://mysite.com/v2/user/register
Content-Length 8
Cookie city=new york; __utma=100174657.1435105779.1308773648.1314994226.1315368765.113; __utmz=100174657.1315368765.113.98.utmcsr=mysite.com|utmccn=(referral)|utmcmd=referral|utmcct=

Headers Post Response JSON
Object { name=”pizza”, point=1}
[Object { name=”pizza”, point=1}]

It works fine with chrome on the same machine, but not firefox and safari.

Answer 1

You have to make sure, that your return values are “really” json. Some browsers dont accept json which isn’t syntactically correct.

so make 100% sure you return something like:

{"foo": 1, "bar": "foobar"}

this is correct json.

e.g. this is not:

{'foo': 1, 'bar': "foobar"}

this is also wrong:

{foo: 1, bar: "foobar"}

further some advices to your javascript code:

   return {
                label: item.name,
                value: item.name
            }

this is not correct, wrap your keys in quotes.
return {
“label”: item.name,
“value”: item.name
}

Generally I’ve read many time you should do ajax calls as GET Requests not POST, because POST produces more overhead and traffic. But don’t nail me for that.

Further, when you want to return e.g. an array from within php, use json_encode($var)

http://php.net/manual/de/function.json-encode.php

For your concrete use case return:

{"name": "pizza", "point": 1}

from within your php script.

Try this on your page in firebug:

var obj = jQuery.parseJSON('[{"name":"pizza","point":1}]');

    for (var i = 0; i < obj.length; i++) {
        var object = obj[i];
        for (property in object) {
        var s = property + "=" + object[property] + "<br>";
            $("#console").after(s); console.log(s)
        }
    }