JQuery mobile list view: change value on click
I am having trouble phrasing my question. So I have a list in jQuery mobile and it was created dynamically. Rather than linking to an external page when a list item is clicked, I just want to be able to grab the text of the item they clicked.
In my case it is a list of names and I want to know which one he clicked. I created a list in HTML with:
<div data-role="content" data-theme="b">
<div id="friends_list_view" class="content-primary" data-theme="c">
<ul data-role="listview" data-filter="true" data-theme="c">
</ul>
</div>
</div>
When the item is clicked I want to run some function using the name they chose. How can i do this?
and then dynamically update it later:
var listString = null;
for(i in session_library){
listString = '<li><a href="#">'+session_library[i]['name']+'</a></li>';
$("#friends_list_view ul").append(listString);
}
$("#friends_list_view ul").listview('refresh');
source to share
Assuming your list looks like this:
<ul data-role="listview" data-filter="true" data-theme="c" id="my_listview">
<li>Row A</li>
<li>Row B</li>
</ul>
you can register a click event handler that will give you text <li>
back for example.
$('#my_listview').delegate('li', 'click', function () {
alert(this.innerText);
} );
Edit : changed vclick
to click
. See Documentation.
source to share