dialog themed incorrectly when re-created

[fcheslack]

http://jsfiddle.net/fcheslack/2ufpQ/1/

Create does not enhance the header/content/footer if the page has been created and is subsequently edited. That code is hidden in an anonymous function that only listens to pagecreate. So if you open footwo dialog, close it and modify the header/content/footer (or just recreate them losing the jqm markup) you cannot recover them when you show it again. This can be fixed by adding another event that anonymous function listens to and enhancing with that, but it can't be 'create' as that breaks it. It also loses the injected close button for the dialog. I would submit a patch fixing these but I'm unclear what the desired structure of that patch would be (and I haven't dug into the problems with having that page.sections markup listen for create).

[stevenday]

Is there any update on this issue and whether it will make it into 1.2? I just ran into it using Backbone to render a whole page as a view and then not being able to redo the header/content enhancements, which is a bit of a killer.

I'm also happy to take a look at providing a patch, but it sounds as if there's some guidance needed on the best way to do it, care to elaborate on anything that makes it particularly tricky?

[viksit]

Why not just use .trigger('pagecreate') to do everything?

[stevenday]

Good question! That's what I am doing actually, and for me it works great, but I read here: #2703 that it can cause other issues, so I assumed it wasn't a full solution, and the existence of this open issue confirmed that. Is there any clarification anywhere as to what could be affected by pagecreate?

[jaspermdegroot]

@scottjehl

Do you think binding to both pagecreate and create here https://github.com/jquery/jquery-mobile/blob/master/js/widgets/page.sections.js#L21 will have negative side effects?

[gabrielschulhof]

This is not so much about re-enhancing page sections as it is about re-enhancing a dialog. The correct sequence to do that in your example is this:

J("#footwo-dialog")
  .page( "destroy" )
  .dialog( "destroy" )
  .empty()
  .html(J("#template").html());

The important thing here is to destroy the page widget and the dialog widget that end up getting instantiated on the element.

Here's an update to your example: http://jsbin.com/uzaret/534/

Note that the example suffers from #5318 as well as incorrect themeing.

Of course, implementing _destroy() for page and dialog would help make the above code a little simpler. For example, we could chain the destruction of the dialog to that of the page, so you only have to destroy the dialog widget.

[gabrielschulhof]

I've changed the issue summary from "page.section enhancements can't be applied to new injected html".