[Solved] itemDeslected event not raised when calling listview.deselectItemAt(index) - iOS only

[Marc]

Hello,

this issue might be related to my previous issue

I try to implement the selection behaviour for our app, where the user needs to select only the first item with LongPress, then the user can select/unselect the items with a short tap.

The scenario works perfectly on Android, but I have some trouble on iOS again. When the user is in selection mode (he has selected at least one item) and he taps on one item, I check if the item is already selected.... and if so, I deselect the item this way: args.object.deselectItemAt(args.index); . I would expect, that deselecting an item this way would make the listview raising the itemDeselected event, where I want to remove the 'selected' CSS class of the even deselected item. That does not happen on iOS, but it is perfectly working on Android.

This is what I am doing:

exports.onItemTap = function (args) {
    if(vmModule.vmMain.get('selectingItems')) {
        if(args.object.isItemSelected(args.object.getItemAtIndex(args.index))) {
            args.object.deselectItemAt(args.index);
        } else {
            args.object.selectItemAt(args.index);
        }
    } else {
        alert("Tap on item " + args.index);
    }
};


exports.onItemSelected = function(args) {
    /*item has been selected, enable selection mode if not already active*/
    vmModule.vmMain.set("selectingItems", true);
};


exports.onItemDeselected = function(args) {
    if(args.object.getSelectedItems().length === 0) {
        console.log("no items selected anymore.... leaving selection mode");
        vmModule.vmMain.set("selectingItems", false);
    }
};

 

Please tell me if you are able to reproduce this issue using my extended sample project and if this is a bug in the iOS RadListView or if it's a wrong usage of the functionalities on my side.

 

Best regards and thank you in advance

[Marc]

While creating this test project, I noticed that I could do the switch from LongPress selection (for the first item) and short Press for the next items this way:

In XML:

<lv: RadListView
    ...
    selectionBehavior="{{ !selectingItems ? 'LongPress' : 'Press' }}"
    ...
</lv:RadListView>

 

And in my onItemTap event, I just need to check if I am in the selection mode, otherwise I would call the usual tap functionality:

exports.onItemTap = function(args) {
    var bindingContext = args.view.bindingContext;

    if(!vmModule.vmBookmarks.get('selectingItems')) {
        alert("i am not in selection mode, so do the usual tap handling here for the corresponding item);
    }
};

 

So I don't need to do the "short" select or deselect handling in the tap event anymore. Doing the Press/LongPress selection/deselection this way makes the itemDeselected event raised on iOS as well.

But nevertheless, my other issue still exists, as I am not able to access the view of the item in the itemDeselected event

[Nick Iliev]

Hi Marc,

I can confirm that indeed there is inconsistency in the deselectItemAt method as it will trigger the itemDeselected event on Android but not on iOS.
However, based on your code base, you can workaround this by directly applying the logic for the itemDeselected event in your itemTap callback.

For example:

exports.onItemTap = function (args) {
    if(vmModule.vmMain.get('selectingItems')) {
        if(args.object.isItemSelected(args.object.getItemAtIndex(args.index))) {
            args.object.deselectItemAt(args.index);

            try {
                args.view.getChildAt(0).className = "listitem";
            } catch(e) {
                console.log(e);
            }

            if(args.object.getSelectedItems().length === 0) {
                console.log("no items selected anymore.... leaving selection mode");
                vmModule.vmMain.set("selectingItems", false);
            }

        } else {
            args.object.selectItemAt(args.index);
        }
    } else {
        alert("Tap on item " + args.index);
    }
};

The issue for itemDeselected not being triggered on iOS is logged here as a bug.

Regards,
Nikolay Iliev
Progress Telerik

[Marc]

Hello Nikolay,

thanks for your reply and thanks for creating an issue for this and for the other thread on Github.

 

I also noticed another inconsistency:

<lv: RadListView
    ...
    selectionBehavior="{{ !selectingItems ? 'LongPress' : 'Press' }}"
    ...
</lv:RadListView>

 

When I do the selection/deselection on LongPress/Press this way, the tap event and the itemSelected/itemDeselected event is triggered at the same time. But they are triggered in a different order on Android than on iOS. On Android: itemTap -> itemDeselected. On iOS: itemDeselected -> itemTap. It would be great if this could be unified for both platforms. (itemTap -> itemDeselected)

 

 

[Nick Iliev]

Hi Marc,

Indeed it seems that the events are raised in different order for both platforms. I have logged this one here and marked it as a bug, but we will investigate further if this is not caused by the differences in the way iOS and Android are handling the touch event gesture (which is behind Press for selectionBehavior). Keep track on the linked issue for updated information and possible upcoming fixes.

Regards,
Nikolay Iliev
Progress Telerik