search

surveyjs / survey-creator

Scalable open-source survey software to generate dynamic JSON-driven forms within your JavaScript application. The form builder features a drag-and-drop UI, CSS Theme Editor, and GUI for conditional logic and form branching.
https://surveyjs.io/open-source
Other
923 stars 377 forks source link

Running survey creator inside a form. #3705

Open chr15stevens opened 1 year ago

chr15stevens commented 1 year ago

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

A question or requesting a feature.

What is the current behavior?

"Warning: validateDOMNesting(...):

cannot appear as a descendant of ." error in browser console. Creator doesn't seem to work.

What is the expected behavior?

Ideally there would be a way to run survey creator without a form to increase compatibility with other frameworks.

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

Try to use survey creator inside any form.

Specify your

  • browser: brave
  • editor version: 1.9.61
JaneSjs commented 1 year ago

Hello @chr15stevens, Unfortunately, it is unclear how to reproduce the issue. Would you please share an example for research?

chr15stevens commented 1 year ago

Apologies Jane. I can share some sample code.

<form>
    <SurveyCreatorComponent creator={new SurveyCreator({})} />;
  </form>

Running the above anywhere will show "Warning: validateDOMNesting(...): cannot appear as a descendant of ." in the browser console.

JaneSjs commented 1 year ago

Hello @chr15stevens, Please accept my apologies for the delayed reply. I appreciate you shring the code. I created the following demo but didn't seem to get any exceptions: Plunker. By the way, the <form> HTML element is used to create a form that can be used to collect data from a user. A form is a collection of input elements, such as text fields, checkboxes, radio buttons, and buttons, that allow a user to enter data or make selections. Therefore, I'm wondering why you wish to place a Survey Creator inside a form? Would you please elaborate on your usage scenario?