Comments (7)
Il 10/07/2012 10:33, Martin Häcker ha scritto:
With a route configured like this:
{ "#nonExistingPage": { handler: "nonExistingPage", events: 'bC' } }
And a handler like this
nonExistingPage: function() { console.log('nonExistingPage') $('body').append('<div data-role="page" id="nonExistingPage" data-url="nonExistingPage"><h1>Hello World</h1></div>') } I see that the nonExistingPage handler is always called twice when navigating to this page. I can of course account for that, but it seems like a bug none the less.
Hi,
using the pagebeforechange event is not recommended because you have to
properly know how jquery mobile internals work, since this is the main
routing event used by the framework. This event is always fired twice,
but with different arguments.
There's an example here: examples/test-bC.html.
The key points are:
* call e.preventDefault()
* check the .toPage property
If you really want to inject pages in the dom by hand (remember that
jquery mobile does this automatically with an ajax call), you may want
to consider using pagebeforeload instead of pagebeforechange (see
examples/testbl.html).
You'll just simulate the "ajax" behavior of the framework without
actually performing the ajax call.
Hope this clears things up a bit, but I know that this advanced jquery
mobile usage seems really crazy at first (mainly because it wasn't
designed to do this, to begin with).
Cheers,
Andrea
from jquerymobile-router.
pagebeforeload seems like a good idea, but I didn't get it to trigger if for me. That is just changing the event to { "#nonExistingPage": { handler: "nonExistingPage", events: 'bl' } }
didn't work for me - the handler is never called.
from jquerymobile-router.
As per the example, it would be my understanding that this should result in the handler getting called when navigating to that page:
var mainController = new MainController();
new $.mobile.Router([
{ "#nonExistingPage": { handler: "nonExistingPage", events: 'bl' } }
], mainController, { ajaxApp: true });
However that also doesn't seem to work.
from jquerymobile-router.
Still back to the handler: Regardless of how the underlying handlers work in jQuery Mobile, wouldn't it make a lot of sense that if I register a handler for the pagebeforechange event for a specific page, I only get the handler called once?
from jquerymobile-router.
Il 10/07/2012 11:32, Martin Häcker ha scritto:
Two quick notes:
- e.preventDefault from the handler is not possible, as you don't get access to the event
- same for the toPage property - it's not available from the handler.
You have access to all these elements in the handler.
See the test-bC example
testDocEvts: function(type,match,data,scope,e){
console.log("document event! "+type);
e.preventDefault();
if (typeof(data.toPage)!=="string") return;
$.mobile.changePage( $('<div data-role="page"
data-url="localpage4"><div data-role="header"><h1>title</h1></div><div
data-role="content">page4content<a data-role="button" href="#index">back
to index</a></div></div>').appendTo("body") );
}
from jquerymobile-router.
Il 10/07/2012 11:32, Martin Häcker ha scritto:
Two quick notes:
- e.preventDefault from the handler is not possible, as you don't get access to the event
- same for the toPage property - it's not available from the handler.
That being said, pagebeforeload seems like a good idea, but I didn't get it to trigger if for me. That is just changing the event to
{ "#nonExistingPage": { handler: "nonExistingPage", events: 'bl' } }
didn't work for me - the handler is never called.
If you switch to the pagebeforeload event, you're basically changing the
way your application works.
When you switch from a single-file multipage template (hash based pages)
to the ajax paradigm (required for the pagebeforeload to work), you need to:
* change your links from #nonExistingPage to nonExistingPage
* add ajaxApp: true during the router initialization
Use the test-bl.html file as an example.
from jquerymobile-router.
Well, many thanks for the help, it helped a lot!
from jquerymobile-router.
Related Issues (20)
- Not an issue actually but the request to provide more advanced example HOT 3
- jQM 1.3.0 HOT 8
- Examples don't work HOT 2
- default handler not called HOT 3
- Routing issues with JQM 1.3.1 and knockout.js HOT 3
- Early Router - Too late for first page? HOT 2
- Debugging snippet gets in the way HOT 4
- URI parameters are striped out when using new pagebeforechange event HOT 4
- Loading the first page via bc handler HOT 6
- handler getting called twice even when step "url" selected HOT 1
- With requireJs, router initialises after jQuery Mobile page events trigger HOT 2
- How does one access the data object resultant from a $.mobile.navigate('#target',{}) invocation HOT 1
- production ready? HOT 1
- e.preventDefault() on a re-routing system HOT 1
- Are urls like this "#category/:id/items" possible? HOT 1
- Can this be used using two different html files? HOT 4
- Back Problem HOT 2
- Bower support HOT 1
- defaultHandler is not invoked when customer handlers are not specified
- Am I right that this plugin doesnt work in jqmobile 1.4.5 HOT 3
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from jquerymobile-router.