Cordova app has internet connection via emulator, but not on device [update: ajax problem]

Viewed 174

I am trying to build a small app via cordova that sends data to a PERL-Script on a server. The debug and release build work fine on the genymotion emulator, however sending the data from Android phones does not work. There is no error message from the app (either, which is supposed to show up when the connection fails). Running USB debugging, I do get the follwoing invoke error message (the savedataLastpage funtion is supposed to send the data):

Uncaught TypeError: Illegal invocation
at e (jquery-2.1.3.min.js:4)
at Ac (jquery-2.1.3.min.js:4)
at Function.n.param (jquery-2.1.3.min.js:4)
at Function.ajax (jquery-2.1.3.min.js:4)
at Object.saveDataLastPage (index.js:631)
at Object.renderLastPage (index.js:461)
at Object.recordResponse (index.js:597)
at HTMLButtonElement.<anonymous> (index.js:357)
at HTMLButtonElement.dispatch (jquery-2.1.3.min.js:3)
at HTMLButtonElement.r.handle (jquery-2.1.3.min.js:3)

The pertaining code is the following:

index.js:631

saveDataLastPage:function() {
 $.ajax({
        type: 'post',
        url: '/URL/',
        data: localStore,
        crossDomain: true,
        success: function (result) {
        var pid = localStore.participant_id, snoozed = localStore.snoozed, uniqueKey = localStore.uniqueKey, pause_time=localStore.pause_time;
        localStore.clear();
        localStore.participant_id = pid;
        localStore.snoozed = snoozed;
            localStore.uniqueKey = uniqueKey;
            localStore.pause_time=pause_time;
        $("#question").html("<h3>Thank you, your responses have been sent.</h3>");
        },

        error: function (request, error) {
            console.log(error);
             $("#question").html("<h3>Error: Please check your internet connection.</h3><br><button>Send again</button>");
             $("#question button").click(function () {app.saveDataLastPage();});    
            }
        });

},

index.js:461

else {
    var datestamp = new Date();
    var year = datestamp.getFullYear(), month = datestamp.getMonth(), day=datestamp.getDate(), hours=datestamp.getHours(), minutes=datestamp.getMinutes(), seconds=datestamp.getSeconds(), milliseconds=datestamp.getMilliseconds();
    localStore[uniqueKey + '.' + "completed" + "_" + "completedSurvey"  + "_" + year + "_" + month + "_" + day + "_" + hours + "_" + minutes + "_" + seconds  + "_" + milliseconds] = 1;    
    app.saveDataLastPage();
}

As stated before, on the genymotion emulator the ajax script works fine without the error and sends the data to the script.

1 Answers

I'm not sure why the emulator would work just fine but the error Uncaught TypeError: Illegal invocation suggests that it is a problem with the ajax post call. Specifically, the default setting of processing the data into a query string likely fails.

From the ajax documentation:

By default, data passed in to the data option as an object (technically, anything other than a string) will be processed and transformed into a query string, fitting to the default content-type "application/x-www-form-urlencoded". If you want to send a DOMDocument, or other non-processed data, set this option to false.

That means you can either turn off the processing processData: false which will post the data in the body of the request or you have to transform the localStore data into a proper object (from whatever it was before).

If it is like an object you can do the following:

var data = {}; for (var elem in localStore) { data[elem] = localStore[elem]; }

or possibly in brief:

var data = {}; localStore.each(function(elem) { data[elem.name] = elem.value; });

Related