New question, but really close to need to refresh page in jquery mobile.
I have a /login page, to which user is redirected when accessing the / of the app for the first time (therefore not logged). BTW, to login, user has only to provide a username. This /login page offers a form with a single text input, as follows:
<form method="post">
<span>Votre pseudo:</span>
<input id="username" name="username" data-bind="value: username, valueUpdate: 'afterkeydown'" />
<input type="submit" id="join" data-icon="star" value="Rejoindre !" data-bind="enable : canJoin"/>
</form>
There is no action attribute on the form, therefore (unless I’m missing some fundamentals, hope not) the form submits with post to /login.
I’m using NodeJS with express, and handling the post request server side looks like this:
app.post("/login", function (req, res) {
//do some stuff, store username for instance...
res.redirect("/");
});
I am indeed redirected to the / matching page (index), but embedded scripts in this index page are not run, and some jquerymobile objects are not fully operational: this index file has 2 JQM page (two divs with data-role=”page”), and the footer of the first JQM page(div) has 2 links, with one pointing to the second page(div) (via anchors, JQM way). But this link isn’t active either.
I do have to reload the / page in order to have the embeded scripts run ($(document).ready, scripts in header…) and all JQM objects responding correctly.
HINT: before reloading the page, in firebug, the the post /login request’s response has a 302 statut (is it due to the redirect instructions server side), and the following get / request (sure due to the redirect instructions server side) has an EMPTY response with a 200 statut, although it could load the page and the single image it embeds.
I’m surely missing something but can’t figure out…
thanks for all your help
JQuery mobile uses ajax to load the requested page into the dom. The page you are requesting should only have one jqm “page” on it.
As I remember, I had to add all my scripts to my first page, and then bind to the page change event to decide when to execute them. I don’t think jqm will execute the scripts in the page that was loaded via ajax.
Take a look at the page structure here:
http://jquerymobile.com/demos/1.0.1/docs/pages/page-anatomy.html
More details in how the navigation works is here:
http://jquerymobile.com/demos/1.0.1/docs/pages/page-navmodel.html