Question

i have a multi-column layout where “#content-primary” is the div i want the actual content loaded, and “#content-secondary” holds a generated listview of links(effectively a navigation menu).

I’m using this code to change the page, pretty much following the JQM Docs, however the browser is following the links to entirely new pages, instead of loading the content from them into the “#content-primary” div. There’s obviously something I’m missing.

$(function(){
            $('#menu a').click(function() {
                $.mobile.changePage($(this).attr('href'), {
                    pageContainer: $("#content-primary")
                } );
            });
        });

Using Django on the backend, but it probably isn’t relevant.

Answer 1

I finally found an answer here. JQuery Mobile’s changePage() and loadPage() methods do too much post-processing and triggers a lot of events that really makes implementing your own dynamic loading more complicated than it should be.

The good old fashioned #("div#primary-content").load(); works, but I’m still struggling to apply JQM styles to it.