Question

We are building a single page application using jQuery Mobile framework. the scenario we have is that we dont want to use the default behavior of having href links being hijacked and rendered as ajax response because practically, the page change causes the screen to flicker a bit and we dont want that to happen. so, to avoid that, we shall write our own ajax calls to the server to get specific data and update the content on page using the response from the server. However, in doing so any javascript that needs to be bound on the response AND the Css styling on the response HTML is completely lost.

Can somebody please advise what would be the best way to rebind / refresh the JS & CSS for the html received via Ajax.

Answer 1

Read “Enhancing new markup” in the JQM documentation. The trigger('create') event should solve this:

$( ...new markup that contains widgets... ).appendTo( ".ui-page" ).trigger( "create" );