Geek Answers Handbook

How to programmatically create lists in JQM

I have an array from ajax and I need to create jQuery Mobile Listview . I did not find a method for this, so maybe?

+4
source share
1 answer

Here is a working example: http://jsfiddle.net/Gajotres/SS7vJ/

And another example with an array: http://jsfiddle.net/Gajotres/yHHWQ/

$(document).on('pagebeforeshow', '#index', function(){ $('<ul>').attr({'id':'test-listview','data-role':'listview', 'data-filter':'true','data-filter-placeholder':'Search...'}).appendTo('#index [data-role="content"]'); $('<li>').append('<a href="#">Audi</a>').appendTo('#test-listview'); $('<li>').append('<a href="#">Mercedes</a>').appendTo('#test-listview'); $('<li>').append('<a href="#">Opel</a>').appendTo('#test-listview'); $('#test-listview').listview().listview('refresh'); });

Also do not forget to call .listview (twice, first without the update parameter and the second time with the update parameter. Without it, you will get this error:

cannot call methods in list view before initialization

If you want to know more about how jQuery mobile handles dynamically added content and its layout, look at this ARTICLE to be transparent, this is my personal blog or find it HERE .

+8
source

More articles:


All Articles