2

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.

sw00
  • 980
  • 2
  • 16
  • 29
  • $.mobile.changePage() can be called externally and accepts the following arguments (to, transition, back, changeHash). What makes you think you can pass a page container in? – Ruslan Jul 06 '11 at 09:33
  • According to the documentation(http://jquerymobile.com/test/docs/api/methods.html), it takes two arguments: changePage(to, options) where options is a collection of properties. pageContainer is one of these properties. [quote]pageContainer (jQuery collection, default: $.mobile.pageContainer) Specifies the element that should contain the page.[/quote] – sw00 Jul 07 '11 at 09:44

3 Answers3

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.

sw00
  • 980
  • 2
  • 16
  • 29
0

interestingly, this contradicts with this:

$.mobile.changePage() can be called externally and accepts the following arguments (to, transition, back, changeHash).

And when tested this works: $.mobile.changePage("index.html", "slideup"); but this does not: $.mobile.changePage("index.html", { transition: "slideup" });

Perhaps documentation is not quite right?

Ruslan
  • 9,927
  • 15
  • 55
  • 89
  • So it seems the method I want to use is either deprecated or not implemented at all. Which is a pity because it offers functionality that many people using JQM want. There are some plugins that offer split column navigation but that seems like a lot of overhead as I only want it for one view: http://stackoverflow.com/questions/6515525/how-to-make-split-jquery-mobile-layout-for-ipad – sw00 Jul 07 '11 at 11:24
  • changePage(to, options) is the new signature according to: http://jquerymobile.com/blog/2011/06/20/jquery-mobile-beta-1-released/ it now changes the page but the entire page transitions off screen as soon as the it finishes loading, so it shows a blank screen. i believe changePage is still calling some code to refresh the new page that shouldn't be called. – sw00 Jul 07 '11 at 11:54
0

Update to the new beta 1 release

Victor Moura
  • 1