CODEWITHSUNDEEP
jqueryjquery-mobilecordova
mike029
mike029

Reputation: 321

jQuery Mobile messing up formatting in Cordova

I'm having an issue with jQuery Mobile and how it's ignoring any jQuery after a pageChange. jQuery cannot find any elements on the page, and is returning errors involving "cyclic functions" and stuff like that.

You can see after the pageChange back to the same page, it's clearly ignoring the functions to determine if a user is logged in or not, hide/show links, etc. Also it is drawing the config button twice, and messing up formatting.

Messed up formatting and ignoring jQuery after pageChange

Upvotes: 0

Views: 146

Answers (2)

devnull
devnull

Reputation: 171

Are you creating this content dynamically? You have to do things in a very specific order with JqM. Here are a few best practices for JQueryMobile development:

  • Do all of your event binding inside the pageinit event. See http://jquerymobile.com/demos/1.2.0/docs/api/events.html for details
  • Make sure that if you drop new elements onto the page, you call .trigger('create') on them.
  • Any calls to .trigger('create') need to be made AFTER calls to $.mobile.changePage.

Upvotes: 0

mike029
mike029

Reputation: 321

The simple answer is this:

Do not put any of the JS code in the body for jQm projects. Put everything in the head.

Normally we put JS in the body at the end for performance reasons, but jQm operates by doing some magic in the body (messing up everything if your JS is located there).

Cordova now defaults to putting all the JS at the end of body, so I just used what they had. Not the right move for jQm.

Put all JS in the head.

Upvotes: 2

Related Questions