CODEWITHSUNDEEP
listviewjquery-mobile
user1125394
user1125394

Reputation:

jQuery mobile error "cannot call methods on listview prior to initialization"

I'm dynamically filling a <ul data-role="listview"> then calling location.href="#Results" where the list is, and finally listview('refresh').

All that is done in the success callback of an Ajax request from the same page. It works more or less but I'm getting the following error:

Uncaught cannot call methods on listview prior to initialization; attempted to call method 'refresh'

I guess jQuery mobile did not construct the listview yet. What could I do?

Upvotes: 21

Views: 42011

Answers (7)

Iwan Ross
Iwan Ross

Reputation: 354

This is what worked for me:

   $(document).delegate('#Results', 'pageshow', function (){
   $('#mylistview').listview('refresh').trigger('create'); 
   });

Upvotes: 0

robinclark007
robinclark007

Reputation: 151

simply add listview.refresh works fine for me,and I'm using ajax to load content into the div too.

document.getElementById("myListview").innerHTML = xmlhttp.responseText;
//works fine on my work
$('#myListview').listview('refresh');

here if my post.

jquery mobile ajax load content into a div element will lose it's css style

I spend almost 3 hours to solve my post probem.finaly find the answer here.thanks.

Upvotes: 0

Arnaud Weil
Arnaud Weil

Reputation: 2502

Just call the listview method without any parameter first:

$('#myListview').listview().listview('refresh');

Solution taken from http://www.gajotres.net/uncaught-error-cannot-call-methods-on-prior-to-initialization-attempted-to-call-method-refresh/

Upvotes: 42

Ashisha Nautiyal
Ashisha Nautiyal

Reputation: 1397

use $.mobile.changePage("#Results"); instead of location.href
actually location.href reload the page so the list view gets destroy

And then listview.refresh

Upvotes: 2

AJ J
AJ J

Reputation: 539

you should check if it is already initialized or not, refresh the list in case it is initialized otherwise trigger create as per the following :

if ( $('#myListview').hasClass('ui-listview')) {
    $('#myListview').listview('refresh');
     } 
else {
    $('#myListview').trigger('create');
     }

Upvotes: 28

user1329040
user1329040

Reputation:

I had the same error. I solved it by adding ":visible" to my query, so it will only run if the list is visible.

So your code will look something like this:

$('#myListview:visible').listview('refresh');

Worked fine for me!

Upvotes: 14

Mark
Mark

Reputation: 876

http://jquerymobile.com/demos/1.1.0/docs/api/events.html You have to hook on the pageinit event. You can't call any JQM methods prior to this. i.e.:

$('#Results').bind('pageinit', function() {
  $('#myListview').listview('refresh');
});

Upvotes: 10

Related Questions