Question

I would like to fire a changepage after a loadpage.
Below is the code I use.
After a submit, a database action is fired at an external site (with loadPage). That works.
Next I would like to change to another page with the guid (unique ID) variable posted.

I can’t get this working.
Hope somebody can. Thanks in advance.

        $(document).on('pageinit', '#page1', function(){

    $('form').submit(function(){

        var guid = GUID();
        $.mobile.loadPage( "http://domain.com/dbaction.php?guid="+guid, {
        type: "post", 
        data: $("form#addtegel").serialize()

        });     
        return false; 
    $.mobile.changePage ($("#page2"),{ transition: "slideup"} );

     });


   });

$(document).on('pageinit', '#page2', function(){
DoSomething(guid);
});

Answer 1

First, you need to make guid a global variable. At the moment, it’s local to your form submission, so it cannot be accesses outside that form submit action.

Second, instead of using loadPage() – which is jQuery Mobile’s internal function called by changePage() by the way – use $.ajax() like this:

var guid;
$(document).on('pageinit', '#page1', function(){

    $('form').submit(function(){

        window.guid = GUID();
        $.ajax({
            url: "http://domain.com/dbaction.php?guid="+guid,
            type: "post", 
            data: $("form#addtegel").serialize(),
            success: function() {
                $.mobile.changePage ($("#page2"), { transition: "slideup"} );
            }
        });
        return false; 
     });

   });

$(document).on('pageinit', '#page2', function(){
    DoSomething(window.guid);
});

Also, please be aware that mixing GET and POST data is a very bad habit. I’m talking about this url: "http://domain.com/dbaction.php?guid="+guid

There should only be GET or POST data present in a single request, not both. Would it not be possible to pass guid to dbaction.php in the POST (using a hidden field in your form)?