Jquerymobile filter listview not working when fetching data dynamically

Question

the code for displaying data using url getfilms.php

var xmlhttp = new XMLHttpRequest();
    var url = "./getfilms.php";
    xmlhttp.onreadystatechange = function () {
        if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
            myFunction(xmlhttp.responseText);
        }
    }
    xmlhttp.open("GET", url, true);
    xmlhttp.send();

    function myFunction(response) {
        var arr = JSON.parse(response);
        //var arr = obj.records;
        var i;
        var out = "";
        for (i = 0; i < arr.length; i++) {
            out += "<li><a href ='" + arr[i].Path + "'>" + arr[i].Film + "</a></li>";
        }
        document.getElementById("searchfilmsbyname").innerHTML = out;
    }

The code for displaying the listview in html side using id="searchfilmsbyname"

<ul data-role="listview"  data-filter="true" data-filter-reveal="true" data-filter-placeholder="Search films..." data-inset="true" id="searchfilmsbyname">

</ul>

Nishit Maheta · Accepted Answer · 2015-04-13 17:29:28Z

1

use below code . use $( ".selector" ).listview( "refresh" ); method when add dynamic data to listview . read more here about refresh

 function myFunction(response) {
    var arr = JSON.parse(response);
    //var arr = obj.records;
    var i;
    var out = "";
    for (i = 0; i < arr.length; i++) {
        out += "<li><a href ='" + arr[i].Path + "'>" + arr[i].Film + "</a></li>";
     if((i+1) == arr.length){
         document.getElementById("searchfilmsbyname").innerHTML = out;
         //  $("#searchfilmsbyname").html( out );  you can use this jquery method to add html inside list view
         $("#searchfilmsbyname").listview('refresh');
       }
    }

}

answered Apr 13, 2015 at 17:29

Nishit Maheta

6,0413 gold badges20 silver badges32 bronze badges

Sign up to request clarification or add additional context in comments.

8 Comments

RRPANDEY Over a year ago

i want to add dynamic link here like "<li><a href ='#filmdetails' onclick='fetchFilmDetails()' data-ajax='false'>" + arr[i].Film + "</a></li>" which will load on click to filmdetails id and fetch data from php such as filmdetails.php?filmId=3 and will display.

Nishit Maheta Over a year ago

@RRPandey "filmdetails" is different page id ?

RRPANDEY Over a year ago

i am using jquerymobile so its id wich will fetch data from filmdetails.php?filmId=3 to this id. fetchFilmDetails does not work

Nishit Maheta Over a year ago

yes but what i say in jquery mobile pages is load base on id right ? so what i am asking is '#filmdetails' is page id where you load data when page load or its element on current page need to load data in same page ?

RRPANDEY Over a year ago

page id is film and div id is #filmdetails

|

Collectives™ on Stack Overflow

Jquerymobile filter listview not working when fetching data dynamically

1 Answer 1

8 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

8 Comments

Your Answer

Sign up or log in

Post as a guest

Related