Hello i have window with main scrollview component. This component contain some text views and few datatables. When i scroll the default behavior is to stop when rich datatable, and start scroll inside cdhild datatable component is there a way to prevent this default behavior ? When scroll only in scrollview , and when set focus to datatable scroll there ? Thanks
Code Snippet, i need to scroll only in scrollview, but when the mouse inside of datatable it start scroll this item
Hello, @roma!
Well, yes, such behavior is by design.
You can customize code to create something similar, but it can be quite difficult.
E. g. on click
it focuses on the view:
webix.event(child.$view.parentNode, 'click', (e) => {
const coord = child.$view.getBoundingClientRect();
if (e.x < coord.right && e.x > coord.left
&& e.y < coord.bottom && e.y > coord.top) {
child.$view.classList.remove('not_visible_for_events');
child.$view.classList.add('focused');
this._showScrollBars(child);
child.$view.dispatchEvent(new MouseEvent('mouseover'));
if (!scrollEvent) {
scrollEvent = webix.event(child.$view.parentNode, 'mousewheel', (e) => {
e.stopPropagation();
});
}
if(child.config.localId === 'experemental') {
const element = document.elementFromPoint(e.x, e.y);
element.click();
}
}
});
And on mouseleave
the focus is removed:
webix.event(child.$view, 'mouseleave', (e) => {
child.$view.classList.add('not_visible_for_events');
child.$view.classList.remove('focused');
this._hideScrollBars(child);
webix.eventRemove(scrollEvent);
scrollEvent = null;
});
Please, check an example: Code Snippet
thanks a lot! It is what I looking for and I see that is complex solution!