QTable n rows



  • in q-table, in a special case that will always show 6 to 20 rows I don’t need the pagination, try with the classes and properties but I don’t get it

     <q-table
                  class="my-sticky-header-table"
                    dense
                    :data="error"
                    :columns="columns"
                    separator="none"
                    bordered
                    square
                    wrap-cells
        virtual-scroll
          pagination.sync="0"
          :rows-per-page-options="[20]"
                    table-header-style="background-color: #F7F7F7; color:#333;"
                  />
    

    the reults

    q-table-rows.jpg

    Thanks in advance



  • How about controlling the data set you are giving the QTable? i.e. just filtering the results you want shown?

    Scott



  • @s-molinari

    I just want all the rows to appear, since they will always do 10 0 20, very few, and they are not data that comes from the server, it is from an internal process that is done in the client and that data must be shown in the q- table

    the problem is that when only 5 appears, it forces the user to paginate, and what should come out would be the scroll with all the rows
    As I said, I am new and I am learning to use these technologies

    Best regards

    pag.jpg



  • Ah. You have to give the pagination prop an object. In that object you can define the default number of rows per page.

    Scott



  • Can we make the rowsPerPage in the pagination props vary according to the screen size?
    something like this:
    pagination: {
    sortBy: ‘desc’,
    descending: false,
    page: 1,
    rowsPerPage: this.$q.screen.width>768 && this.$q.screen.width <= 1024? 14 : 7
    },
    this is working but I need to reload the page to see the rows per page changing according to screen width , Is there a solution to make it responsive ?





  • @metalsadman this is also not working unless I reload the page I can see the number of rows changing


Log in to reply