Dynamically add content to a listview jquery mobile

Question

i am trying to dynamically load items into a listview using javascript.

below is my javascript code

//Dynamically load data fields for items

function initialiseFields(listViewId){
    for(var i = 0; i < 10; i++){
        loadField(listViewId, "hello", "type", "value goes here");
    }
}

/**
load single item field
**/
function loadField(listView, label, type, value){

    //append the list
    $('#listView').append("<li><h3>"+label+":</h3><h4>"+value+"</h4></li>");
    $('#listView').listview('refresh');
}

Html5 code

<body  onLoad="initialiseFields('itemFieldslist');"> 

<div data-role="page" id="page">

        <div data-role="header" data-position="fixed" data-theme="b" >
        <a href="newClaim.html">Back</a>
        <h1><span style="margin-left:1em">List</span></h1>
    </div>

    <div data-role="content">   

        <ul data-role="listview" id="itemFieldslist" data-inset="true"  data-scroll="true" >
        <li data-role="list-divider"> <h2>Title</h2></li>

        </ul>       
    </div>
</div>
</body>

The contents of the listview is always empty except for displaying the header divider for the list

Answer 1

Can you try to wrap initialiseFields in:

$(document).bind('pageinit')

if you check the jquery mobile docs you can see that they discourage the use of $(document).ready()

check here: jquery events

I'll check myself later.

Dynamically add content to a listview jquery mobile

Question

1 answers

solution1
0 2013-07-10 11:09:00

Dynamically add content to a listview jquery mobile

Question

1 answers

solution1 0 2013-07-10 11:09:00

solution1
0 2013-07-10 11:09:00