Issue with add elements to List view in javascript?

Question

In my application one select menu and list menu are there, I want to fill the values dynamically from DB. I am able to fill values in to select menu dynamically, but How can I fill it in list view, Can Any one tell me how to fill the values dynamically in list view, My is as follows,

for (var i = 0; i < res.rows.length; i++) {
 var opt  = '<option value="';
 opt += res.rows.item(i).Location;
 opt += '">';
 opt += res.rows.item(i).Location;
 opt += '</option>';
 $("#select-choice-location").append(opt);
  }

HTML:

<select name="select-choice-location" id="select-choice-location">
                  <option value="Select Location">Select Location</option>
   </select>
  <ul data-role="listview" id="locationList" name="locationList" data-inset="true">
       <li><a href="#">Select Location</a></li>
   </ul>

Select menu is working fine how to write same syntax for list view to get dynamic values.

Dan-Nolan · Accepted Answer · 2014-04-09 17:08:24Z

2

jQuery has a clean method for creating elements with attributes jQuery(html, attributes) (Link)

Try using it to create your HTML and then append it to the necessary container:

for (var i = 0; i < res.rows.length; i++) {
    // create and append the option tag
    $('<option/>', { value: res.rows.item(i).Location, text: res.rows.item(i).Location})
        .appendTo("#select-choice-location");

    // create and append the li tag
    $('<li/>', { text: res.rows.item(i).Location})
        .appendTo("#locationList");
}

Similar Example

edited Apr 9, 2014 at 17:08

answered Apr 9, 2014 at 17:03

Dan-Nolan

6,6574 gold badges29 silver badges32 bronze badges

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

Comments

Sridhar R · Accepted Answer · 2014-04-09 17:15:23Z

0

Try this

for (var i = 0; i < res.rows.length; i++) {
 var opt  = '<li value="';
 opt += res.rows.item(i).Location;
 opt += '">';
 opt += res.rows.item(i).Location;
 opt += '</li>';
 $("#locationList").append(opt);
  }

Assigning click event

$(document).on('click','#locationList li',function(){

});

edited Apr 9, 2014 at 17:15

answered Apr 9, 2014 at 17:01

Sridhar R

20.4k7 gold badges41 silver badges35 bronze badges

3 Comments

Vinod Over a year ago

Yes it is working fine. Now How can I do on click event on <li> value

Sridhar R Over a year ago

click event or <a> tag element

Sridhar R Over a year ago

@user3300593 i added jquery click method

Collectives™ on Stack Overflow

Issue with add elements to List view in javascript?

2 Answers 2

Comments

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related