Dynamic Matrix

A Dynamic Matrix is an extendable input field that enables respondents to provide multiple answers within a single question in a format of a table. It organizes a set of questions or statements along dynamic rows and displays various response options along columns. On-question buttons allow users to manage the matrix content by adding or removing additional copies of dynamic rows. This demo will guide you through the process of setting up a Dynamic Matrix question using the SurveyJS Form Library.

To add a Dynamic Matrix question to your survey or form, create an object with the type property set to "matrixdynamic" and add the object to the elements array. Within this object, specify the question's title and a unique name that identifies the matrix question. Optionally, you can specify a description to place under the title.

To configure matrix columns, populate the columns array. Each object in it specifies settings of a single column. For each column, define its unique name, which will be used to access the column in code, and its title, which will be visible to respondents.

Column cells can contain editors of different types: single- or multi-line inputs, drop-down menus, checkboxes, etc. Use the cellType property to specify the editor type. Define this property in an individual column's configuration object to apply the editor type to that particular column, or set the same property within the matrix configuration object to specify one editor type for all columns. Column-level settings override the matrix-level settings.

Column editor types are based upon standalone question types. Depending on the selected editor type, the matrix column can have additional configuration properties inherited from the corresponding question type. For instance, Dropdown, Checkboxes, Radio Button Group, and Tag Box columns can specify the choices array, similar to the question types upon which they are based.

Refer to the MatrixDropdownColumn API Reference section for a full list of matrix column properties.

A Dynamic Matrix renders two initial rows by default. If you want to change this number, set the rowCount property. You can also limit the minimum and maximum number of matrix table rows. Assign these numbers to the minRowCount and maxRowCount properties. In this demo, a Dynamic Matrix initially displays one row, which is also the minimum row count, and allows users to add up to 10 rows.