Jquery (1.7.1) and getJSON not working

Hi

As far as I understand Jquery + GetJSON should be working. Anyway I have issues

I made a minor change to the damagereport example from Motororla and try to populate a drop down - very simple

Below is added just below the include of "damage.js" in the index.html



<script type="text/javascript">


    $(document).ready(function () {

            $.getJSON('http://jsonservice.erp2mobile.dk/jsonservice.svc/1', function (result) {

                $.each(result, function (name, value) {

                    $.each(value, function (name, value) {

                        $("#reason").append("<option value=\"0\">" + value.name + "</option>");

                    });

                });

            });

        });

</script>

No lines after the getJSON method are executed in RhoElements - works fine in firefox, chrome, ipad, iphone, android...

Whats wrong??

Br

Søren

Søren Corneliussen
Forgot to mention - JQuery is

Forgot to mention - JQuery is of cause included

<script type="text/javascript" src="http://code.jquery.com/jquery-1.7.1.min.js"></script>

Vote: 
Vote up!
Vote down!

Points: 0

You voted ‘up’


Robert Galvin
SorenSorry but I do not see

Soren

Sorry but I do not see any issue on the ES400 with any of the code above. I see data from both your service and flicker appear in the drop down. Make sure you scroll down the drop down or you won't see the data from your service. It looks like the app has the width of the drop down too wide so you don't see any scrollbars. I had to use the optic sensor with my finger on the ES400 to scroll down the list. See attached screen grab.Screen02.jpg

Vote: 
Vote up!
Vote down!

Points: 0

You voted ‘up’


Søren Corneliussen
HiI changed my json

Hi

I changed my json webservice to return in jsonp format. Now everything is working.

NOTE: I haven't yet tried the to launch the app using other than file:// yet. (so that might also have worked)

Thanks

Vote: 
Vote up!
Vote down!

Points: 0

You voted ‘up’


Robert Galvin
SorenI just tried that code

Soren

I just tried that code using 1.0.3.8 version of RhoElements (on an ET1) and it works just fine. Are you trying to launch the app using file:// as your start page or do you have it running from a server. If it is file:// then the reason it is not working is that JSON will not work in this way on RhoE. You can alter RhoE to use a web server (look in help file for more information)

Capture.PNG

Vote: 
Vote up!
Vote down!

Points: 0

You voted ‘up’


Kjell Lloyd
Rob, I believe he is seeing

Rob, I believe he is seeing the issue on a Motorola Windows Mobile based device such as ES400 (as it works fine on plain vanilla Android devices, iPhone etc).

Vote: 
Vote up!
Vote down!

Points: 0

You voted ‘up’


Robert Galvin
Kjell I also tried this on 1

Kjell

I also tried this on 1.0.3.8 and an ES400. I think the issue was trying to run the app from a local file:// or that 1.0.3.8 fixed it.

Rob

Vote: 
Vote up!
Vote down!

Points: 0

You voted ‘up’


Søren Corneliussen
I also used newest version 1

I also used newest version 1.0.3.8

A bit strange that the flicker json service works and mine doesn't

So unfortunately i still have a problem. A bit embarassing as it seems very simple

Best regards / Venlig hilsen

Søren Corneliussen

Vote: 
Vote up!
Vote down!

Points: 0

You voted ‘up’


Søren Corneliussen
Hi againI'm pretty much going

Hi again

I'm pretty much going crazy :-)

The first .getJSON call works - calls a flicker json webservice, the last one doesn't on an ES400. (works on iphone, ipad, browser  - not using RhoElements.).

<script type="text/javascript">

    alert("Getting data from Flicker JSON Service");

    $.getJSON("http://api.flickr.com/services/feeds/photos_public.gne?jsoncallback=?",

    {

        tags: "cat",

        tagmode: "any",

        format: "json"

    },

    function(data) {

        $.each(data.items, function(i,item){

          $("#reason").append("<option value=\"2\">" + item.media.m + "</option>");

          if ( i == 3 ) return false;

        });

    });

</script>   

<script type="text/javascript">

    alert("Getting data from ERP2mobile JSON Service");

    $.getJSON("http://jsonservice.erp2mobile.dk/jsonservice.svc/1",

    function(data) {

        $.each(data.JSONList, function (i, item) {

            $("#reason").append("<option value=\"2\">" + item.name + "</option>");

        });

    });

</script>

There is no difference - or maybe a little one. The JSON data from Flicker is contained in ( ). But that should not be a problem - it works in iphone,ipad,android...  (please note - this is not using Rho Elements)

@Rob - can I get you to try this on an ES400?

Vote: 
Vote up!
Vote down!

Points: 0

You voted ‘up’


Bernard Castelein
Soren, there is a (big)

Soren, there is a (big) difference between the 2 getJSON statements:

The flickr request is not an ajax request  but a jsonp call:

From http://api.jquery.com/jQuery.getJSON/ :

If the URL includes the string "callback=?" (or similar, as defined by the server-side API), the request is treated as JSONP instead. See the discussion of the jsonp data type in $.ajax() for more details.

The second getJSON is a crossdomain ajax request which is blocked for security reasons.

More info on:

http://devlog.info/2010/03/10/cross-domain-ajax/

Jsonp is a technique to work around the cross domain restrictions.

Conclusion: this is a javascript security issue.

Vote: 
Vote up!
Vote down!

Points: 0

You voted ‘up’


Søren Corneliussen
Ahh now I'm learning

Ahh now I'm learning something new. I will try to make second call a jsonp.

But is this a client side issue on rhoelements es400 since vanilla iPhone, iPad, chrome,.. handles this without problems? Do you know?

Note that I have allowed CORS for my json web service (cross Origin resource sharing) - Access control Allow Origin. Before allowing that the iPhone, etc did not work.

Vote: 
Vote up!
Vote down!

Points: 0

You voted ‘up’


Log in to post comments