14118

JQM 1.4.1: The new event 'pagecontainershow'

Question:

I got confused with JQM changes:

As you may know JQM deprecated the event:

$(document).on('pageshow', '#MyPage', function(){

and replaced it by:

$(document).on('pagecontainershow', function (e, ui) {

However this new event is not attached to an specific page as the previous was. Nevertheless, the event:

$(document).on('pagecreate', '#MyPage', function(){

is still attached to a specific page, and i think other pages events are still attached to specific pages.

MY QUESTION IS:

The fact that some events are attached to pages and other no, makes the framework very confusing. Should'nt be better to standarized all events as the version 1.3 was in which all were attached to pages?

Will the event 'pagecreate' and all pages events be dettached to pages in the future as 'pageshow' is now in version 1.4.1

Can someone please explain how events work in 1.4.1

Thanks

Answer1:

I just resolved the issue of pagecontainershow not being able to attach to a PAGE by using a "switch case" sentence like this:

$(document).on('pagecontainershow', function (e, ui) { var ThisPage = $(':mobile-pagecontainer').pagecontainer('getActivePage').attr('id'); switch(ThisPage){ case 'Page1': case 'Page2': case 'Page3': etc....

However my concern is that if they modify the framework to support (back again) the event attached to pages, then I should be doing rework and rework.

Answer2:

Here's some code based on the previous response I wrote that made my converting JQM 1.3 code in my HTML files easier after finding that the issue about this that Omar posted was closed as not a bug:

function setPageContainerHandlers(){ function getPageContainerEventHandler(action){ var handler = function(e, ui){ var id = $(':mobile-pagecontainer').pagecontainer('getActivePage').attr('id'); var f = window.page_handlers[action]['#' + id]; if ('function' == typeof f){ f(e, ui); } } return handler; } var events = ['pagecontainershow', 'pagecontainerhide', 'pagecontainerbeforeload', 'pagecontainerbeforeshow', 'pagecontainerload', 'pagecontainerloadfailed', 'pagecontainerchangefailed']; var actions = ['pageshow', 'pagehide', 'pagebeforeload', 'pagebeforeshow', 'pageload', 'pageloadfailed', 'pagechangefailed'] for(var i = 0; i < events.length; i++){ var handler = getPageContainerEventHandler(actions[i]); $(document).on(events[i], handler); window.page_container_handlers[events[i]] = handler; window.page_handlers[actions[i]] = {}; } } function registerPageHandler(id, action, handler){ window.page_handlers[action][id] = handler; }

Then, as long as setPageContainerHandlers() is called in a <script> tag in the document head,

$("#results").on("pagebeforeshow", initResults);

becomes

registerPageHandler("#results", "pagebeforeshow", initResults);.

Answer3:

How about just checking for the current page and exit the event if not the one you want? That way, you can use separate functions as "normal".

$(document).on('pagecontainershow', function (e, ui) { if (ui.toPage[0].id != "YOUR_PAGE_1") return; //Do you stuff for YOUR_PAGE_1 here }); $(document).on('pagecontainershow', function (e, ui) { if (ui.toPage[0].id != "YOUR_PAGE_2") return; //Do you stuff for YOUR_PAGE_2 here });

Recommend

  • ASP.NET MVC Drop Down List
  • Regular Expression to identify a Guid followed by a number
  • What is the difference between CacheStoreMode USE and REFRESH
  • Django - Subdomains with Middleware or Subdomains with Apache Virtual Hosts?
  • MYSQL select all records where username and date pair occur more than once
  • Regex in class name to identify controls
  • CLOSED!! How i can detect the type from a string in Scala?
  • Standard way for writing a debug mode in C++
  • rails - convert DateTime to UTC before saving to server
  • What's a better way to swap two argument values?
  • LatLong falls within a given polygon in D3 + Leaflet
  • Remove every nth element from swift array
  • Dependency conflict in integrating with Cloudera Hbase 1.0.0
  • How to combine two lists together?
  • Trouble Attaching Call Back to Unobtrusive Validation Show Error
  • Why does IE8 fail to resolve my JQuery selector for a checked radio option?
  • Unicorn and Rails eat up 2x MySQL connections
  • help('modules') crashing? Not sure how to fix
  • What is the reason that Policy.getPolicy() is considered as it will retain a static reference to the
  • if some function is not optimized does it mean that all functions where it is declared are not optim
  • Can I use AllJoyn Framework for Wifi Direct in iOS?
  • SQL Query - Table Joining Problems
  • Hide HTML elements without javascript, only CSS
  • Copy to all folders batch file?
  • Zurb Foundation _global.scss meta styles for js?
  • How can I sort a a table with VBA with given text condition?
  • Moving mysql files across servers
  • TFS: Get latest causes slow project reloading
  • htaccess rewriting URLs with multiple forward slashes
  • Display Images one by one with next and previous functionality
  • How to make Safari send if-modified-since header?
  • Web-crawler for facebook in python
  • How to pass list parameters for each object using Spring MVC?
  • Hibernate gives error error as “Access to DialectResolutionInfo cannot be null when 'hibernate.
  • A cron job substitute?
  • using HTMLImports.whenReady not working in chrome
  • Setting background image for body element in xhtml (for different monitors and resolutions)
  • Authorize attributes not working in MVC 4
  • EntityFramework adding new object to nested object collection
  • JaxB to read class hierarchy