Question T10585
Visible to All Users

Pagination for Matrix Dynamic questions

created 3 years ago

I have a matrixdynamic section with expression celltypes and want to show some readonly data.
Is there a way so for ex. if there are 100 records to display it paginated(paginating the section not the entire page) as lets say 10 per page?

Sign in to comment on this post

Answers approved by surveyjs Support

created 3 years ago

Hello Muhamedi,
Unfortunately, Matrix Dynamic questions don't have an option to paginate items.
As an option, you can configure CSS for the Matrix Dynamic question and limit the maximum height. The following example limits the height to 300px.

CSS
.custom-matrixdynamic.sd-question--scroll{
    overflow: hidden;
}
.custom-matrixdynamic .sd-question__content{ 
    overflow: auto;
    max-height: 300px;
    width: 100%;
}

Example.

As a result, the Matrix Dynamic will take a limited area and the vertical scrollbar will be displayed allowing users to scroll down the Matrix Dynamic question contents.
Clipboard-File-1.png

See also: Custom css.

By the way, could you please share an example of a Matrix question containing 100 records. Please feel free to send me some screenshots/mockup demonstrating the resulting output.

I look forward to your reply.

    Comments (2)
    M M
    Muhamedi 3 years ago

      I don't have a case where we have 100 records, but that is something we are expecting to happen.
      This is the JSON that I am currently using to show those values:

      JavaScript
      {
    "type": "matrixdynamic",
    "name": "matrix_students",
    "title": "Students",
    "allowAddRows": false,
    "allowRemoveRows": false,
    "rowCount": 0,
    "columns": [
      {
        "cellType": "expression",
        "name": "student_grade",
        "title": "Grade"
      },
      {
        "cellType": "expression",
        "name": "student_course",
        "title": "Course"
      },
      {
        "cellType": "expression",
        "name": "student_name",
        "title": "Name"
      },
      {
        "cellType": "expression",
        "name": "student_surname",
        "title": "Surname"
      }
    ]
}

      So if we cant do pagination with this, is there any other control or configuration that will let us achieve pagination ? Because scrolling wont be user-friendly with large amount of data.

      Jane 3 years ago

        Thank you for the clarification, Muhamedi.
        Unfortunately, Matrix Dynamic doesn't have any option to enable pagination. I appreciate you sharing your usage scenario.

        Let us know if you have further questions.

        Thank you,
        Jane
        SurveyJS Team

        Sign in to comment on this post