I had tough time get the value of selected item of a ListView. So in this post I am sharing the code snippet required to fetch selected item from the ListView.

Read this article for ListView Binding with Grouping and Semantic Zoom in Windows 8 JavaScript Metro Application

I strongly suggest you to read the above article for more detail on ListView. If you continue with above article and want to get the value of selected item you can do that as below,

lstMovies = document.getElementById("movieListView").winControl;  
lstMovies.addEventListener("iteminvoked", function (e) {
                e.detail.itemPromise.then(function (invokedItem) {

                    var titleOfData = invokedItem.data.title;
                    var selecteplayerImg = invokedItem.data.picture;
            }, false);

In above code snippet

  • lstMovies is name of the ListView.
  • Iteminvoked is name of the event. This event gets fire when an item in the ListView is being selected.
  • There are two data bind to the List View item. They are Title and Picture. Any data can be fetched as following snippet. invokedItem is parameter of itemPromise.


Title and Picture are properties of the datasource bind to the ListView.

In this way you can fetch selected item from ListView in HTML based Windows 8 Metro Application. I hope this post is useful. Thanks for reading!


4 thoughts on “How to fetch selected item of ListView in HTML based Windows 8 Metro Application

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s