Navigation

    Quasar Framework

    • Register
    • Login
    • Search
    • Categories
    • Recent
    • Tags
    • Popular
    • Users
    • Groups
    • Search

    Scrolling inside a q-table

    Help
    3
    4
    19
    Loading More Posts
    • Oldest to Newest
    • Newest to Oldest
    • Most Votes
    Reply
    • Reply as topic
    Log in to reply
    This topic has been deleted. Only users with topic management privileges can see it.
    • Z
      zwiebel_s last edited by

      Hello all,

      I have a Quasar layout with a q-table that resizes as the window expands. The table also has a fixed table header. My requirement is that you can scroll the table using the 3 sticky buttons (I am not sure if it is right to work with “q-page-sticky” elements.). The scroll-to-top button should only be visible when the user scrolls in the table.

      Here a codepen:
      https://codepen.io/tbr2021/pen/xxEaaRY

      I tried out methods like:

      scrollUp () {
        var table = document.getElementsByClassName('test')
        table.scrollTop = 500
      },
      

      or with a ref

      scrollTop () {
        this.$nextTick(function () {
          this.$refs.testDiv.scrollTop = 0
        })
      },
      

      but both didn’t work.

      Maybe someone can help me out with this…

      1 Reply Last reply Reply Quote 0
      • Hawkeye64
        Hawkeye64 last edited by Hawkeye64

        @zwiebel_s Are you more or less thinking about something like this? https://quasar.dev/layout/page-scroller#Example--Basic

        Z 1 Reply Last reply Reply Quote 0
        • Z
          zwiebel_s @Hawkeye64 last edited by

          @Hawkeye64 yes but the scrolling in my example is in the q-table and not on the page

          metalsadman 1 Reply Last reply Reply Quote 0
          • metalsadman
            metalsadman @zwiebel_s last edited by metalsadman

            @zwiebel_s qtable has a scrollTo(rowindex) method.

            1 Reply Last reply Reply Quote 0
            • First post
              Last post