This repository was archived by the owner on Oct 8, 2021. It is now read-only.
This repository was archived by the owner on Oct 8, 2021. It is now read-only.
Simple way to init inserted elements #1799
Closed
Description
There needs to be a simple way init everything, and that init needs to be idempotent (something similar to FB.XFBML.parse).
If I were to do something like this:
$(".ui-content").append("<ul data-role='listview' data-inset='true'><li>Foo</li><li>Bar</li></ul>");
Ideally, jQuery Mobile should automatically handle this and parse it. But I understand that may be difficult in all cases (replace/insert/append/etc). So I should at least be able to do something like:
$(".ui-content").jqmobile.parse();
Better yet, I should be able to do something like this:
var newList = $("<ul data-role='listview' data-inset='true'><li>Foo</li><li>Bar</li></ul>").jquerymobile.parse();
$(".ui-content").append(newList);
Metadata
Metadata
Assignees
Labels
No labels
Type
Projects
Milestone
Relationships
Development
No branches or pull requests
Activity
toddparker commentedon Jun 9, 2011
We completely agree that we need an easy way to enhance appended markup. It's a tricky thing to get right so we've been kicking around ideas internally on this. On our radar for sure.
scottjehl commentedon Jun 9, 2011
Thanks for the idea! I think what we'll end up doing is something along the lines of this (currently in the decoupled widgets branch): df92fbd
It'd work like this:
$(".ui-content").append( ... lots of HTML ...).trigger( "enhance" );
I'm going to move this to the feature requests wiki. Thanks!
tstone commentedon Jun 9, 2011
!!!!!!!
awesome! been waiting for this...
sdhull commentedon Jun 9, 2011
@scottjehl: that syntax looks good to me. I look forward to seeing that get into a release.
@toddparker: while you guys are discussing / implementing, in the meantime, could you please point me towards a resource that can show me the manual way of enhancing appended markup? This is blocking me from continuing forward development.
Thanks guys.
toddparker commentedon Jun 9, 2011
You can call the specific plugins (slider, collapsible, etc.) manually on the markup you're injecting. If you're adding/removing content from an existing widget like a listview or select, call the refresh() method on it.
sdhull commentedon Jun 9, 2011
@toddparker: having more than a general explanation would be useful to me, and probably useful to many others while we workaround this issue.
Specific examples?
(Coincidentally, the above doesn't work for me)
scottjehl commentedon Jun 9, 2011
So, you'll want to use the :jqmData(...) selector for one, just in case there's namespacing on the data attrs, but basically, you can check the top of all of the widgets in this commit for the particulars. We plan to get these documented ASAP as well.
df92fbd
sdhull commentedon Jun 11, 2011
@scottjehl: So I checked out the
decoupled-widgets
branch and built jquery mobile. Works pretty well. Kinda breaks the bottom of the page and the footer toolbar (well the toolbar still works but it stops following page scroll).All in all, much better than before. Thank you!!
TommyKolkman commentedon Jun 16, 2011
It seems to work only partly for me; I checked out this branche and I'm running this code:
$('#wordpress').live('pagecreate',function(event){
$.getJSON('http://www.steez.nl/?json=get_recent_posts&callback=?', function(data){
$.each(data.posts, function(key, value) {
$('.blogList').append('
'+ this.title +'
'+ this.excerpt +'
});
});
return false;
});
But only ua-link seems to be enhanced afterwards, the rest of the styles aren't. It's probably something I'm doing wrong myself, but I can't see what.
Also, @toddparker, which refresh() method are you referring to? This might apply better to my situation.
dafinley commentedon Jun 19, 2011
Is it possible to put the ul element in the dom already, then stuff the inner html, then call the refresh on the ul element?
Instead of trying to inject the ul element...inject the innerHTML if you can
dafinley commentedon Jun 19, 2011
This might be a shortcut as well.....
http://jquerymobiledictionary.dyndns.org/faq.html
sdhull commentedon Jul 5, 2011
@scottjehl: is there a timeline for merging
decoupled-widgets
into master? I noticed that Beta 1 has been released but the decoupled widgets branch is still unmerged. This ticket was marked as "Critical" and then closed, implying that this is fixed, but on mainline this is still a problem, is it not?