使用选项来定义编辑器

Source code: Survey setup

//Use default options. See more information about Survey options bellow.
var editorOptions = {};
var editor = new SurveyEditor.SurveyEditor("editorElement", editorOptions);

Survey 选项

You may:

  • Show/hide survey tabs.
  • Show/hide options menu button and turn-on valid JSON generation
  • Limit question types you want to have in the toolbox
  • Set the designer height

Show/hide survey tabs.

By default, “Survey Designer”, “JSON Editor” and “Test Survey” are visible. “Embed Survey” tab is invisible. The following boolean properties in editorOptions give you the control under them. Please note, that there is no property for “Survey Designer” tab. You can’t make it invisible.

  • showJSONEditorTab
    • Show/hide JSON editor tab. It is true by default.
  • showTestSurveyTab
    • Show/hide Test Survey tab. It is true by default.
  • showEmbededSurveyTab
    • Show/hide a tab that shows how to embed the survey into your web page. It is false by default.
var editorOptions = {showJSONEditorTab: false};
//There will be two tabs visible: "Survey Designer" and "Test Survey"
var editor = new SurveyEditor.SurveyEditor("editorElement", editorOptions);

Show/hide options menu button and turn-on valid JSON generation.

There is an Options menu button in the editor. You may see ithere. It is invisible by default and in the most cases you do not need it showing it to your end-users. However, you may decide to generate a valid JSON, instead ofJSON5. The SurveyJS editor generates JSON5 json by default.

generateValidJSON

  • Generate valid JSON if it is true and a

JSON5 - modern, user-friendly

if it is false. It is false by default and as result, the generated JSON is not VALID.

showOptions

  • Show/hide options menu button, it is false by default.

Limit question types you want to have in the toolbox

You may limit question types your end-users may use in the editor.

The following example show how to show in the toolbox only four question types.

var editorOptions = {questionTypes : ["text", "checkbox", "radiogroup", "dropdown"]};
var editor = new SurveyEditor.SurveyEditor("editorElement", editorOptions);

There are more possibilities for toolbox customization. Please goto this demoto learn more about toolbox customization API.

Set the designer height

By default the designer height is “75vh”. You may find it in the surveyeditor.css. You may set the designer height via options. The following examples set the designer height to 700px:

var editorOptions = {designerHeight: "700px"};
var editor = new SurveyEditor.SurveyEditor("editorElement", editorOptions);

results matching ""

    No results matching ""