jQuery UI Widgets Forums Chart Chrome Scroll Issue

Tagged: , ,

This topic contains 4 replies, has 3 voices, and was last updated by  Kamp 3 years, 7 months ago.

Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
  • Chrome Scroll Issue #113536


    I’m using jqxGrids with Vue. When using a grid with source

    source: {
      datatype: "json",
      url: "/api/",
      data: {
        name: this.queryName,
        operation: "read",
      type: "POST",
      root: "records",
      datafields: [], // will be populated before mount

    scrolling in Chrome and Edge Chromium gets out of sync.
    Meaning, when using selectionmode="multiplerows" or similar and you flick your mouse wheel a couple times the cursor and the highlighted row is off by 1 or 2 rows.
    When using source: {localdata:...} it works just fine.
    Also, this issue doesn’t seem to appear on Firefox or IE.
    Is this a known issue? What would be a possible fix?


    Chrome Scroll Issue #113579


    Hello Kamp,

    We have not encountered such an issue.
    Is it possible that you provide us an example so we can observe what may cause it?
    Thank you!

    Best Regards,
    Martin Yotov

    jQWidgets team

    Chrome Scroll Issue #113596


    Hello Martin, thanks for the reply.
    Unfortunately I do not have a publicly available database to query from.
    Do you happen to provide one with at read access only?

    Some additional information on how I set it up:
    I’m using Nuxt (which I know is not officially supported), however I’m forcing it to run on client side only which should make it run as if it was plain Vue.

    I basically set it up as follows:

        <span v-if="columns.length == 0" >Loading</span>
    let JqxGrid = null;
    if (process.client) {
      JqxGrid = require("jqwidgets-scripts/jqwidgets-vue/vue_jqxgrid.vue").default;
    export default {
      components: {
      data() {
        return {
          source: {...}
          columns: []

    and in nuxt.config.js

    export default {
      css: [{ src: '@/assets/scss/main.scss', lang: 'scss' }],
      build: {
        transpile: ['jqwidgets-scripts']

    and main.scss

    @import "jqwidgets-scripts/jqwidgets/styles/jqx.base.css";
    @import "jqwidgets-scripts/jqwidgets/styles/jqx.bootstrap.css";

    That’s about it.
    I do not use jqx.dataAdapter(source) to feed the source into JqxGrid as it’s used within vue_jqxgrid.vue anyway (could this be an issue?).
    columns gets filled within beforeMount() via an axios call, since I’m using the my grid component for a couple of different queries.


    Chrome Scroll Issue #113597


    I would suggest you to update to the latest version, which resolves scroll issue related to Chrome 86.

    Best regards,
    Peter Stoev

    jQWidgets Team

    Chrome Scroll Issue #113600


    Hello Peter,
    I updated to 10.1.6 and that seems to have done the trick.
    Thank you very much!


Viewing 5 posts - 1 through 5 (of 5 total)

You must be logged in to reply to this topic.