locked
Select Item from Listview using iteminvoke in Javascript.

    Question



  •  Hello, I have a ListView with items. I am trying get clicked item from Listview using "iteminvoked".

        <div id="listView_Id" data-win-control="WinJS.UI.ListView" 
             data-win-options="{
                    itemTemplate: select('#smallListIconTextTemplate'),
                    selectionMode: 'single',
                    tapBehavior: 'none',
                    layout: { type: WinJS.UI.GridLayout }
                }">
        </div>

    Here ListArray is array of values with filenames picked using 'FilePicker'

                    dataList = new WinJS.Binding.List(listArray);
                    var listControlDiv = document.getElementById("listView_Id");
                    var listControl = listControlDiv.winControl;
                    listControl.itemDataSource = dataList.dataSource;

    I set ListView dataSource from JS file rather than HTML file by fallowing this question.

    I created handler like this.

            document.getElementById("listView_Id").addEventListener("iteminvoked", doClickItem, false);

     But unfortunately, My doClickItem handler doesn't call at any way. While in same manner select item from Listview which is working Fine.

    Here is my complete project to try Thanks

    Thanks


    devendra


    • Edited by GDEVENDRAK Monday, December 23, 2013 12:33 PM
    Monday, December 23, 2013 12:30 PM

Answers

  • Hi GEVENDRAK,

    I tried your project, and it works with right click event but not left click. I think this is because you set "tapBehavior" as none which block the tap event. Take a look at this: http://msdn.microsoft.com/en-us/library/windows/apps/hh701303.aspx

    But you should also be aware that only one MessageDialog is allowed during the app life, in your case, you open two MessageDialog at the same time, one for doClickItem and one for doSelectItem, a "Access denied" error message will be thrown. What I've done is to comment some of your code, works fine now.

        function doClickItem(eventInfo) {
            var listView = document.getElementById("listView_Id").winControl;
            var indexSelect = listView.selection.getIndices();
            var dlg = new Windows.UI.Popups.MessageDialog("Clicked Item Index: " + indexSelect);
            //dlg.showAsync();
        }

    --James


    <THE CONTENT IS PROVIDED "AS IS" WITHOUT WARRANTY OF ANY KIND, WHETHER EXPRESS OR IMPLIED>
    Thanks
    MSDN Community Support

    Please remember to "Mark as Answer" the responses that resolved your issue. It is a common way to recognize those who have helped you, and makes it easier for other visitors to find the resolution later.

    • Marked as answer by GDEVENDRAK Thursday, December 26, 2013 4:13 PM
    Wednesday, December 25, 2013 5:48 AM
    Moderator

All replies

  • Hi GEVENDRAK,

    I tried your project, and it works with right click event but not left click. I think this is because you set "tapBehavior" as none which block the tap event. Take a look at this: http://msdn.microsoft.com/en-us/library/windows/apps/hh701303.aspx

    But you should also be aware that only one MessageDialog is allowed during the app life, in your case, you open two MessageDialog at the same time, one for doClickItem and one for doSelectItem, a "Access denied" error message will be thrown. What I've done is to comment some of your code, works fine now.

        function doClickItem(eventInfo) {
            var listView = document.getElementById("listView_Id").winControl;
            var indexSelect = listView.selection.getIndices();
            var dlg = new Windows.UI.Popups.MessageDialog("Clicked Item Index: " + indexSelect);
            //dlg.showAsync();
        }

    --James


    <THE CONTENT IS PROVIDED "AS IS" WITHOUT WARRANTY OF ANY KIND, WHETHER EXPRESS OR IMPLIED>
    Thanks
    MSDN Community Support

    Please remember to "Mark as Answer" the responses that resolved your issue. It is a common way to recognize those who have helped you, and makes it easier for other visitors to find the resolution later.

    • Marked as answer by GDEVENDRAK Thursday, December 26, 2013 4:13 PM
    Wednesday, December 25, 2013 5:48 AM
    Moderator
  •  Oh.. My Bad, Now only I realized that.

    I have another doubt here. I know it is not proper way to ask another one here; 

    But it is relevant to Listview. When I click on Listview I want to navigate to another HTML page(Page Control).

     Using this I am getting selected Item.

    function itemInvokedHandler(eventObject) {
                    eventObject.detail.itemPromise.done(function (invokedItem) {
       var index = invokedItem.index;
    }

    Using JavaScript how can I call another JavaScript page with this value "index". If my question not clear please ask any further info regarding this.

    Thanks Jamles,


    devendra

    Thursday, December 26, 2013 4:13 PM