Grid not scrolling on mobile device

Hi,

http://foxincloud.com/tutotest/bs/dataUpdate.tuto

when swiping over the grid, page scroll instead of the grid … quite sure it used to work however it seems broken now…

we changed JS libraries around, not sure it can have had an impact.

Here is what I find in Safari debug:

1. when swipe starts, window resizes to minimize title bar so the window.resize() event triggers

https://www.dropbox.com/s/wfpixcmhyxeubcx/AW-grid-scroll-debug-1.png?dl=0

2. AW.dispatch(element:window, event:event) calls AW.object(element.id)

https://www.dropbox.com/s/cws68v0y3ax8yha/AW-grid-scroll-debug-2.png?dl=0

3. as id is undefined, AW.object(id) fails on

var parts = id.split("-")

https://www.dropbox.com/s/25jiojcesaksnfy/AW-grid-scroll-debug-3.png?dl=0

Would this patch help?

var parts = id ? id.split("-"): [];

Any clue?
Thanks,

this patch removes the error above but does not fix the scrolling issue:

AW.dispatch = function(element, event){

        if (!(element && element.id)) return; // added for patch

        var type = "_on" + (events[event.type] || event.type) + "Event";
        var target = AW.object(element.id);
        var obj = target;

        while (obj._parent){
            obj = obj._parent;
        }

        return target[type].call(obj, event);
    };

I am a bit confused here. The standard examples still work fine on iOS -

http://v2.activewidgets.com/general.demos/virtual-mode.html

http://v2.activewidgets.com/general.demos/basic-grid.html

As for AW.dispatch (or usually AW(element, event)) - it is expecting an AW element as the first argument (which must have an id). It is only used in inline event handlers like this -

<div onclick="AW(this, event)">...</div>

Maybe you are using this function with jQuery and it is somehow get called with window object as the first argument instead of the AW element?

Hi Alex,

thanks for investigating this issue; we need some more work to find the cause.

there is a difference however: the sample grids of ActiveWidget sites are within an iframe:

<iframe src="/examples/2.5/basic.htm" style="width:500px;height:150px" frameborder="0">

I find only one touchstart event, registered for aw:

https://www.dropbox.com/s/s1w3w88d48shcm2/Capture%20d%27%C3%A9cran%202018-02-16%2013.52.18.png?dl=0

any other event could be conflicting in this case?

the examples still work without iframe -

http://v2.activewidgets.com/examples/2.5/virtual.htm

AW does not use touch events for scrolling - it allows you to scroll the content area and then listens to scroll events to update the content (in case of virtual scrolling).

What looks wrong to me is how AW(element, event) is called on the window level - I cannot find anything like that in AW source.

Also, the onresize event handler is only set on scrollbars span element - which is only supported in older IE. So onresize event should not fire on iOS at all.

Hi Alex,

The issue is still pending… I need your help to know where I can start debugging.

On http://foxincloud.com/tutotest/bs/dataUpdate.tuto, no more 'window.onresize' bug after applying your patch, thank:

if (!(element && element.id)) return; // added for patch

Scrolling on touch device no longer raises any error, except page still scrolls instead of the grid.

These work fine:
- On the desktop, mouse scroll button (AKA middle button)
- Your example without iframe and additional JS library: http://v2.activewidgets.com/examples/2.5/virtual.htm

I suspect that another library (jQuery or Bootstrap) stops the propagation of the event that AW uses for updating the grid's content.

Loading aw.js after the other libraries does not help.

- What event does AW use to update the grid's contents?
- Where is it attached to?
- In which source file is the corresponding code?
- Do you have a suggestion where I can set a breakpoint to understand what happens?

Thanks in advance

This may help find the issue:

on the Desktop, http://v2.activewidgets.com/examples/2.5/virtual.htm, grid does not scroll using middle mouse button (while it does on http://foxincloud.com/tutotest/bs/dataUpdate.tuto)

Update:
On the desktop,
http://v2.activewidgets.com/examples/2.5/virtual.htm

Grid scrolling with the middle mouse button:
- safari (mac): OK
- edge (PC): OK
- chrome (Mac & PC): OK
- Firefox (mac & PC): KO on the grid surface, OK on the grid scrollbar

Hope this help shedding a light on our issue,
Thierry Nivelet

The scrolling issue is due to this rule in your css (line 456) -

.aw-touch .aw-hpanel-middle {
overflow:hidden;
}

The value must be 'scroll', if I disable this rule, the scrolling works fine.

Issue was due to a stupid CSS rule we added:

.aw-touch .aw-hpanel-middle {
  overflow:hidden;
}

Alex helped us change it into:

.aw-touch .aw-hpanel-middle {
  overflow:scroll;
}

Works just fine now!!

Thank you very much Alex!