surveyjs / survey-library

Free JavaScript form builder library with integration for React, Angular, Vue, jQuery, and Knockout.
https://surveyjs.io/form-library
MIT License
4.09k stars 795 forks source link

Create question type matrixdropdown with columns dynamic #2177

Closed Huuvinh94 closed 3 years ago

Huuvinh94 commented 4 years ago

Are you requesting a feature, reporting a bug or asking a question?

Question

What is the current behavior?

I have a kind question type checkbox: image

And question: image

What is the expected behavior?

I want create one question type matrixdropdown with columns (or rows) dynamic from answer Question 1 and Question 2

Example: Question 1: Honda Question 2: Audi

Same as in the picture below: image

Is there any solution to create columns as above? Please help me!

How would you reproduce the current behavior (if this is a bug)?

Provide the test code and the tested page URL (if applicable)

Tested page URL:

Test code

your_code_here

Specify your

tsv2013 commented 4 years ago

We have similar example on our site - https://surveyjs.io/Examples/Library?id=condition-matrixVisibleIf Hope it helps

Huuvinh94 commented 4 years ago

@tsv2013 Thank you for your answer. I have seen the example above and already know how to use properties rowsVisibleIf and columnsVisibleIf, but when change columns (question type matrixdropdown) same as below:

columns: [ { name: 'matrix-col-1', title: 'Ford', choices: [''], cellType: 'checkbox', }, { name: 'matrix-col-2', title: 'Vauxhall', choices: [''], cellType: 'checkbox', }, { name: 'matrix-col-3', title: 'Volkswagen', choices: [''], cellType: 'checkbox', }, ]

then properties columnsVisibleIf does not work :((

tsv2013 commented 4 years ago

You can create a dropdown martix with cell in several columns. Here is the liva sample on our site - https://surveyjs.io/Examples/Library?id=questiontype-matrixdropdown-multiplecolumns

The same sample adopter for checkboxes - https://plnkr.co/edit/SXLHmpSaF5tyakoK

Huuvinh94 commented 4 years ago

@tsv2013 Thank you for your answer.

The above method works well for me, but i want to show the selected answers from Question 1 and Question 2, i have tried use columnsVisibleIf but it did not work :(( Ex: questions: [ { type: 'checkbox', name: 'car', title: 'What cars have you being drived?', isRequired: true, choices: [ 'Audi', 'BMW', 'Citroen', 'Ford', 'Mercedes-Benz', 'Nissan', 'Peugeot', 'Tesla', 'Toyota', 'Vauxhall', 'Volkswagen', ], }, { type: 'matrixdropdown', name: 'Feelings', title: 'Please select best car for each category?', columnsVisibleIf: '{car} contanis {item}', columns: [ { name: 'col1', cellType: 'checkbox', showInMultipleColumns: true, isRequired: true, choices: [ 'Audi', 'BMW', 'Citroen', 'Ford', 'Mercedes-Benz', 'Nissan', 'Peugeot', 'Tesla', 'Toyota', 'Vauxhall', 'Volkswagen', ], }, ], rows: [ 'Style', 'Performance', 'Comfort', 'Quality', 'Safety', 'Features', ], }, ],

Do you have any examples for me? Thanks you very much!

tsv2013 commented 4 years ago

Unfortunately SurveyJS desn't have option to build matrix columns from two questions. You can add/remove columns programmatically only via API.

Huuvinh94 commented 4 years ago

@tsv2013 Thank you for your answer. I did what you said and it work very well.