0

I want to creat an Android Application with HTML, CSS, and jQuery. I have tried to implement the .load() function of jQuery on this way. It works on the browser but not as an Android Application. Is there an other solution, for example with AJAX?

$(document).ready(function() {

  $('#nav li a').click(function(){

    var toLoad = $(this).attr('href')+' #content';
    $('#content').hide('fast',loadContent);
    $('#load').remove();
    $('#wrapper').append('<span id="load">LOADING...</span>');
    $('#load').fadeIn('normal');
    function loadContent() {
      $('#content').load(toLoad,'',showNewContent())
    }
    function showNewContent() {
      $('#content').show('normal',hideLoader());
    }
    function hideLoader() {
      $('#load').fadeOut('normal');
    }
    return false;

  });
});

Thanks

Edit:

i tried also this:

$(document).on('pageinit', function() {
// handle menu clicks
$("ul#nav li a").click(function() {
    var page = $(this).attr("href");
    $("#content").load(page + ".html");

});

});

Emjay
  • 1
  • 2
  • 1
    Are you just using the Android browser to view this or are you embedding some kind of webview? – Anthony Atkinson Dec 14 '13 at 16:15
  • Its a webview with eclpise as IDE – Emjay Dec 14 '13 at 16:30
  • Check out this article: http://developer.android.com/guide/webapps/debugging.html#WebView which should show you console messages in the case of JavaScript errors within your WebView. It helps debugging JS inside WebView cases. – Anthony Atkinson Dec 14 '13 at 16:36
  • Also this may help: http://stackoverflow.com/questions/468993/is-there-a-way-to-enable-the-javascript-error-debug-console-for-safari-within-an – Anthony Atkinson Dec 14 '13 at 16:38
  • I'm not sure but I don't think that there is a error in the JS. I tried different ways and solutions which I found on the internet. – Emjay Dec 14 '13 at 17:20

1 Answers1

0

I got a solution: function getContent(href) {

    $.ajax({
        type : "GET",
        //url: href + ".html",
        //url : "http://localhost/ProVid/" + href + ".html",
        url: "http://webuser.hs-furtwangen.de/~lieneman/pages/" + href + ".html",
        //url: "http://webuser.hs-furtwangen.de/~lieneman/pages/vorstellung.html",
        dataType : "html",


        beforeSend : function(xhr) {
            xhr.overrideMimeType("text/html; charset=ISO-8859-1");
        },
        success : parseHTML,

        error : function(xhr, ajaxOptions, thrownError) {
            alert(xhr.status);


            $('#content').html("<h3 style='text-align: center;'>Es ist ein Fehler aufgetreten</h3>");

        }
    });

}

But you have also to know that this is only working on a webspace or virtual webspace like xampp and you have to at "#" to the href attribute.

Emjay
  • 1
  • 2