grid horizontal scroll

[devermaParticipant]

Hello Team,

I have set height of grid and width is 100% but my grid column are more than screen size so vertical and horizontal both scrollbar display on grid.
the problem is that when i tried to scroll grid with touchpad vertical scroll bar is working fine but horizontal scrollbar is not working.

Following is my grid configration.
this.settings = {
source: this.source,
theme: ‘reqtest’,
enablemousewheel: true,
autosavestate: false,
autoloadstate: true,
enabletooltips: false,
columns: this.columns,
columnsmenu: false,
columnsautoresize: true,
columnsresize: gridAttributes[‘columnsresize’],
columnsreorder: gridAttributes[‘columnsreorder’],
autoshowcolumnsmenubutton: false,
showsortcolumnbackground: true,
width: ‘100%’,
height: window.innerHeight – that.gridHeight + ‘px’,
autorowheight: false,
columnsheight: 30,
rowsheight: 30,
filterrowheight: 38,
enableellipsis: true,
autoheight: false,
touchmode: true,
pageable: gridAttributes[‘pageable’],
pagesize: gridAttributes[‘pageable’] ? gridAttributeValues[‘pagination’].size : 0,
pagesizeoptions: gridAttributes[‘pageable’] ? gridAttributeValues[‘pagination’].pagesizeoptions : [],
localization: GridLocalizationComponent.localization(this.translate),
sortable: gridAttributes[‘sortable’],
sorttogglestates: ‘1’,
showsortmenuitems: false,
filterable: gridAttributes[‘filterable’],
showfilterrow: gridAttributes[‘showfilterrow’],
autoshowfiltericon: gridAttributes[‘autoshowfiltericon’],
showfiltermenuitems: false,
showpinnedcolumnbackground: true,
showfiltercolumnbackground: true,
showgroupsheader: gridAttributes[‘showgroupsheader’],
filtermode: gridAttributes[‘filtermode’],
groupable: gridAttributes[‘groupable’],
showgroupmenuitems: gridAttributes[‘showgroupmenuitems’],
groupsrenderer: GridCommonServiceComponent.groupsRenderer.bind(this),
enableanimations: false,
showemptyrow: true,
showstatusbar: false,
showaggregates: false,
showeverpresentrow: false,
showtoolbar: false,
showrowdetailscolumn: false,
enablebrowserselection: false,
enablekeyboarddelete: false,
selectionmode: gridAttributes[‘selectionmode’] ? gridAttributes[‘selectionmode’] : ‘none’,
enablehover: true,
altrows: false,
editable: false,
rowdetails: false,
keyboardnavigation: false,
virtualmode: false,
clipboard: false,
};

return this.settings;
}

[Peter StoevKeymaster]

Hi deverma,

Unfortunately, we cannot reproduce a behavior in which horizontal scrollbar does not work. Please, share online link to a sample, ex: jsfiddle.net, codepen, etc.

Regards,
Peter

[BennyParticipant]

Hello Peter,

The horizontal scrollbar not working using the touchpad when horizontal and vertical both scrollbar coming.

Sample JQXgrid

Thanks

[Peter StoevKeymaster]

Hi Benny,

The horizontal scroll works on touch screen by using swipe left/right as well as the vertical scrollbar swipe top/bottom. The laptop’s touchpad moves the vertical scroll, not the horizontal. It moves the horizontal when there is no vertical and uses the same logic as the mouse wheel.

Regards,
Peter

[BennyParticipant]

Hi
Is there any solution to stop the behavior of horizontal movement(swipe top/button) on the touchpad when there is no vertical scroll and vice versa.

Thanks

[Author]

Posts