WinJS - ListView event bubbling

Question

I have a listview with "iteminvoked" listener. List contain one input text column for quantity. When i click on textbox for entering quantity "iteminvoked" event fire. How can i stop event when click on textbox in listview.

I have bind list with "WinJS.UI.ListView" control and "WinJS.Binding.Template".

below is my list,

<div id="productsview" class="productsview win-selectionstylefilled"
                         data-win-control="WinJS.UI.ListView"
                         data-win-options="{
                        selectionMode: 'multi',
                        itemTemplate: select('#customProductListTemplate'),
                        layout: { type: WinJS.UI.ListLayout },
                        loadingBehavior: 'incremental',
                        pagesToLoadThreshold: 2,
                        pagesToLoad: 2,
                        automaticallyLoadPages: true
                    }"
                         data-bind="winControl: {
                        incrementalDataSource: productSearchViewModel.customProductManager,
                        iteminvoked: productInvokedHandler,
                        loadingstatechanged: { AfterLoadComplete: '#productResultZero', OnLoading: indeterminateWaitVisibleForProducts },
                        selectionchanged: { eventHandlerCallBack: productListSelectionChanged, appBarId: '#commandAppBar' },
                        }">
                    </div>

below is my template,

<div id="customProductListTemplate" data-win-control="WinJS.Binding.Template">
    <div class="listViewLine" data-win-bind="title: ProductName">
        <div class="ratio1">
            <a class="h4" href="#" data-win-bind="text: ItemId"></a>
        </div>
        <div>
            <h4 class="ellipsis wrapText" data-win-bind="textContent: ProductName"></h4>
        </div>
        <div class="ratio1 textRight">
            <input type="number" data-win-bind="value: SelectedQuantity" data-bind="clickBubble: false" />
        </div>
    </div>
</div>

Thanks in advance....

Answer 1

I got the answer with the help of this post

change in my template,

<input type="number" class="win-interactive" data-win-bind="value: SelectedQuantity; onclick: clickInTextFunction;" />

change in my modal class,

public clickInTextFunction: any;
constructor(odataObject?: any) {
this.clickInTextFunction = WinJS.Utilities.markSupportedForProcessing((ev) => {
            ev.stopImmediatePropagation();
        });
}