0

I have read about this issue and have tried every possible solution online but nothing worked.. Here is my html code...

<!DOCTYPE html> 
<head>
<link rel="stylesheet" href="jquery.mobile-1.2.0.min.css" />
<script src="jquery-1.8.2.min.js"></script>
<script>

$( document ).bind( "mobileinit", function() {
    // Make your jQuery Mobile framework configuration changes here!
    console.log("made cors changes");
    //$.mobile.ajaxEnabled = true;
    $.support.cors = true;
    $.mobile.allowCrossDomainPages = true;

});
</script>
<script src="cordova-2.3.0.js"></script>
<script src="jquery.mobile-1.2.0.min.js"></script>
</head>
<body>

<div data-role="page" id="page1">
    <div data-theme="a" data-role="header" data-position="fixed" >
        <h4>
            JLT
        </h4>

    </div>
    <div data-role="content" >

        <p>
        Send data to server?
        </p>
        <a data-role="button" id="transportYES" data-inline="true">
            Yes
        </a>
        <a data-role="button" id="transportNO" data-inline="true">
            No
        </a>


    </div>
</div>


<script>

$( "#transportYES" ).bind( "click", function(event, ui) {
  console.log('clicked');


    $.ajax({
   type: "GET",
   url: "http://api.wordnik.com//v4/word.json/recant/definitions",
   data: "includeRelated=false&includeTags=false&useCanonical=false&api_key=7741b711eec09c12e05070046d60da6b92e03750359859fde",
   dataType: "json",
   beforeSend:function(){
   console.log('before sending');
   },
   success: function(msg){
     alert( msg[0].word );
   },
   error: function(xhr, ajaxOptions, thrownError){
   console.log(xhr);

     alert( 'error' );
   }
 });


});

</script>
</body>
</html>

If i run this code from chrome i get the response from the server, but when packaged with phonegap it doesnt work from the android emulator.. I have even allowed all domain as follows <access origin=".*"/> in the config.xml file.. Have been stuck on this issue for a long time..please help..!!!!

It works on the device the problem was on the emulator.....couldn't get hold of a testing device earlier.. could have saved so much time...... :)

1
  • Keep in mind, that this access-origin-whitelist does not apply to stuff done via the inAppBrowser-plugin. Whitelisting will only work in the main Cordova webview!
    – Tobias
    May 11, 2015 at 9:19

1 Answer 1

0

Your mobileinit event work work unless you put this code in a file between jQuery and jQuery Mobile.

You have to do as below(just an example)

<script src="js/external/jquery-1.8.2.min.js"></script>
<script src="js/configs.js"></script>
<script src="js/external/jquery.mobile-1.2.0.js"></script>

Inside your configs.js just place your mobileinit

$( document ).bind( "mobileinit", function() {
   //your code
});
6
  • Hi rodrigo thanks for your reply..as you have seen in my code i have already specified the script between both the jquery files..and it even gets called as i have tested it..but as per your suggestion i even put it into an external js file..but still get the same result. xhr.status as '0' in the error block.. Jan 29, 2013 at 11:36
  • hum so the problem is the request, right? try removing that extra "/" in the api url before v4 and so on Jan 29, 2013 at 11:48
  • the request is fine..the above code works perfectly in chrome..thats what confuses me..i have no idea what else i can try.. Jan 29, 2013 at 12:11
  • the js files are not in a folder? Are they in the same folder as index.html? Jan 29, 2013 at 12:47
  • yes..all the files are in the proper location..and loaded properly..the issue is something else..not sure what :( Jan 29, 2013 at 13:25

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.