Change <ul> to <ul data-role = "listview">

Question

I have a list that I only show with icons and headers - without JQM formatting. If the screen width is less than 320 pixels, I want to convert the list to a JQM list <ul data-role="listview"> .

I can add the attribute through jquery, but when I call $ ('. MenuList'). listview ('refresh'); I get the following error:

cannot call methods in a list view before initialization; tried to call the 'refresh' method

Any clues as to what I'm doing wrong?

Thanks!

Frequent

HTML:

 <ul class="menuList"> <li> <div> <a href="l" data-transition="slide" rel="external" class="iconViewport icon"> <span class="menuTitle">GoHere</span> <span class="pusher">111</span> </a> </div> </li> </ul> 

Jquery

 function enhanceMobile () { $('.menuList').attr('data-role', 'listview'); $('.menuList').listview('refresh'); } 

Answer 1

You cannot call .listview('refresh'); for an item that is no longer a list.

If you just added a data-role , you should call .listview(); which calls the widget constructor (while .listview('refresh'); calls the widget update method)

[I already emailed you this, but it belongs here :)]