dialog themed incorrectly when re-created #2215

Closed
fcheslack opened this Issue Aug 4, 2011 · 6 comments

Projects

None yet

6 participants

@fcheslack
Contributor

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).

@scottjehl scottjehl was assigned Aug 5, 2011
@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
viksit commented Aug 18, 2012

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
Member

@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
Contributor

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
Contributor

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

@gabrielschulhof gabrielschulhof added a commit that closed this issue Nov 23, 2012
@gabrielschulhof gabrielschulhof Page: Attach handlers using ._on(). Helps fix #2215
When a page widget is destroyed on an element, the pagebeforehide and pagebeforeshow handlers must be removed, otherwise, if another page widget is instantiated on the same element later on, the handlers from the previous instance will be left around and so the new instance will have the two events handled twice.
b605521
@gabrielschulhof gabrielschulhof added a commit that referenced this issue Nov 23, 2012
@gabrielschulhof gabrielschulhof Dialog: Attach pagebeforeshow handler using ._on(). Fixes #2215.
When a dialog widget is destroyed on an element, the pagebeforeshow handler must be removed, otherwise, if another dialog widget is instantiated on the same element later on, the handler from the previous instance will be left around and so the new instance will have the event handled twice.
9be2bc9
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment