Getting row data in dynamically created listview

Question

Hi i'm creating list view dynamically. I want to get the data of particular row on click, to proceed to further steps. my code is as below

function getList(tx, results){

                $('#DeliveryList').empty();
                var len = results.rows.length;
                for(var i=0; i <len; i++)
                {
                    var deliveryItems = results.rows.item(i);
                    var html = '<li data-role="list-divider">'+deliveryItems.DeliveryName+ ' | ' + deliveryItems.PrimaryName+' <span class="ui-li-count">Copay ='+deliveryItems.Total+'</span> </li><li><a><img src="Pending"/><h3>'+deliveryItems.Name1+'</h3><p>'+deliveryItems.Address+'</p><p>'+deliveryItems.City+' <b></b></p><p><strong>'+deliveryItems.ContactNumber+'</strong></p><a href="#PrescriptionPage" class="cls_btn" id="btn_list" onclick = "Prescription()" >Delivary Details</a></a></li>'; 
                    $('#DeliveryList').append(html).trigger('create'); 
                }
                $('ul').listview('refresh');
            }

My html file looks like

    <div data-role="page" id="page3" >
        <div data-role="header">
                        <a href="#page1" data-icon="back">Back</a>
                        <h1>Heading</h1>
                        <a href="#Page2" class="ui-btn-right" type="submit" data-role="button" data-icon="home" data-theme="b" data-mini="true">Home</a>
                    </div><!-- /header -->
                    <ul data-role="listview" id="DeliveryList" data-inset="true" data-theme="d" data-divider-theme="b"> </ul>
</div>

can any one help me to achieve the result. Thanks in Advance.

Muddu Patil · Accepted Answer · 2013-04-19 07:47:00Z

1

It worked for me with below code

$('ul').children('li').on('click', function () {
                                         alert('Selected Name=' + $(this).text());
                                          });

answered Apr 19, 2013 at 7:47

Muddu Patil

7211 gold badge11 silver badges24 bronze badges

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

Comments

Broxzier · Accepted Answer · 2013-04-18 10:57:06Z

0

You're using jQuery already, why not use it to create these elements aswell? I asume getList() is bound to an event.

// Create the element
var li = $('<li></li>');
// Add your class
li.addClass('list-divider');
// Change the innerHTML
li.html('Your content');

// Then append it to the list
$('#DeliveryList').append(li);

Simply alter this code to your need. This example just adds one <li> element with a class and some content.

Good luck.

answered Apr 18, 2013 at 10:57

Broxzier

2,95920 silver badges37 bronze badges

2 Comments

Muddu Patil Over a year ago

My question is on click on row i should get the data of particular row.

Broxzier Over a year ago

Then bind an click event to the elements which returns their data. Perhaps you want to bind the data when created using $.data.

Collectives™ on Stack Overflow

Getting row data in dynamically created listview

2 Answers 2

Comments

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related