Home/ Questions/Q 8764847
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-13T16:07:59+00:00

I am trying to populate a list view using j query mobile My html

  • 0

I am trying to populate a list view using j query mobile

My html code is

<!DOCTYPE html>


<meta http-equiv="Content-type" content="text/html; charset=utf-8"/>

<title>Demo Page</title>


<script src="http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.js"></script>

<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.css"/>

function onDeviceReady() {}
document.addEventListener("deviceready", onDeviceReady, false);

function Button_onclick() {

for(i=0; i < 3; i++){
        $("#numbers").append('<li>' +i+'</li>' );
}

} 

<div >
    <input id="Click_Button" type="button" value="Submit" onclick="Button_onclick()" />
</div>

<div id="divList" data-role="content">
    <ul id="numbers" data-role="listview" data-inset="true"> </ul>
</div>

Expected Result was like this

Result i Expected

But the result i got was like this

Result Obtained

Can any one tell me what is the problem?

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Because you dynamically alter the listview you need to refresh it for JQM to apply the correct styles. You need to do this everytime you add an item (or items) to a list.

    This can be achieved with the following statement:

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

    if you want to read more about this I want to refer you to the JQM doc:
    http://jquerymobile.com/test/docs/lists/docs-lists.html (Updating lists, at the bottom of the page)

    • 0