How to load external page using Ajax and Cordova?

Question

I want to use $('#externalPageDivID').load('') in order to load an external page and put the content into the div tag within the index.html file. In other words, I want to use Cordova as a wrapper for the external page and eventually use some Cordova APIs.

The problem is that the external page has some relative paths, and when I use the above function my app instead of looking for these resources on the server, it looks for them in the file:// location.

Is there any possibility to deal with relative paths of the external page, even though I can modify its content?

Best regards, TD

Answer 1

The load() method loads data from a server and puts the returned data into the selected element.

The following example displays an alert box after the load() method completes. If the load() method has succeeded, it displays "External content loaded successfully!", and if it fails it displays an error message:

$("button").click(function(){
    $("#div1").load("demo_test.txt", function(responseTxt, statusTxt, xhr){
        if(statusTxt == "success")
            alert("External content loaded successfully!");
        if(statusTxt == "error")
            alert("Error: " + xhr.status + ": " + xhr.statusText);
    });
});