Customize Question Editor

Source code: Survey setup

//Add a tag property to all questions
Survey.JsonObject.metaData.addProperty("questionbase", "tag");
// Change the order of name and title properties, remove the startWithNewLine property and add a tag property
SurveyEditor.SurveyQuestionEditorDefinition.definition["questionbase"].properties = 
["title", "name", {name: "tag", title: "Tag"}, {name: "visible", category: "checks"}, {name: "isRequired", category: "checks"}];
// make visibleIf tab the second after general for all questions
SurveyEditor.SurveyQuestionEditorDefinition.definition["questionbase"].tabs = [{name: "visibleIf", index: 1}];

var editor = new SurveyEditor.SurveyEditor("editorElement");

Question Editor Definition

UI of Question Editors are built based on JSON located in SurveyEditor.SurveyQuestionEditorDefinition.definition property.

You can modify it, before creating the editor object.

The UI builder combines the information for the selected question type and all its parents. For example, the “dropdown” question combines properties and tabs from: “questionbase”, “selectbase” and “dropdown”.

The origional, unmodified definition, you may findhere

Here is the full Question Editors definition as JSON, used in the demo, property SurveyEditor.SurveyQuestionEditorDefinition.definition:

{
  "questionbase": {
    "properties": [
      "title",
      "name",
      {
        "name": "tag",
        "title": "Tag"
      },
      {
        "name": "visible",
        "category": "checks"
      },
      {
        "name": "isRequired",
        "category": "checks"
      }
    ],
    "tabs": [
      {
        "name": "visibleIf",
        "index": 1
      }
    ]
  },
  "comment": {
    "properties": [
      "rows",
      "placeHolder"
    ]
  },
  "file": {
    "properties": [
      {
        "name": "showPreview",
        "category": "imageChecks"
      },
      {
        "name": "storeDataAsText",
        "category": "imageChecks"
      },
      "maxSize",
      "imageHeight",
      "imageWidth"
    ]
  },
  "html": {
    "tabs": [
      {
        "name": "html",
        "index": 10
      }
    ]
  },
  "matrixdropdownbase": {
    "properties": [
      "cellType"
    ],
    "tabs": [
      {
        "name": "columns",
        "index": 10
      },
      {
        "name": "rows",
        "index": 11
      },
      {
        "name": "choices",
        "index": 12
      }
    ]
  },
  "matrixdynamic": {
    "properties": [
      "rowCount",
      "addRowText",
      "removeRowText"
    ]
  },
  "matrix": {
    "tabs": [
      {
        "name": "columns",
        "index": 10
      },
      {
        "name": "rows",
        "index": 11
      }
    ]
  },
  "multipletext": {
    "properties": [
      "colCount"
    ],
    "tabs": [
      {
        "name": "items",
        "index": 10
      }
    ]
  },
  "rating": {
    "properties": [
      "minRateDescription",
      "maxRateDescription"
    ],
    "tabs": [
      {
        "name": "rateValues",
        "index": 10
      }
    ]
  },
  "selectbase": {
    "properties": [
      "hasOther",
      "choicesOrder",
      "colCount"
    ],
    "tabs": [
      {
        "name": "choices",
        "index": 10
      },
      {
        "name": "choicesByUrl",
        "index": 11
      }
    ]
  },
  "dropdown": {
    "properties": [
      "optionsCaption"
    ]
  },
  "text": {
    "properties": [
      "inputType",
      "placeHolder"
    ]
  },
  "matrixdropdowncolumn@checkbox": {
    "properties": [
      "hasOther",
      "choicesOrder",
      "colCount"
    ],
    "tabs": [
      {
        "name": "choices",
        "index": 10
      },
      {
        "name": "choicesByUrl",
        "index": 11
      }
    ]
  },
  "matrixdropdowncolumn@radiogroup": {
    "properties": [
      "hasOther",
      "choicesOrder",
      "colCount"
    ],
    "tabs": [
      {
        "name": "choices",
        "index": 10
      },
      {
        "name": "choicesByUrl",
        "index": 11
      }
    ]
  },
  "matrixdropdowncolumn@dropdown": {
    "properties": [
      "hasOther",
      "choicesOrder",
      "optionsCaption"
    ],
    "tabs": [
      {
        "name": "choices",
        "index": 10
      },
      {
        "name": "choicesByUrl",
        "index": 11
      }
    ]
  },
  "matrixdropdowncolumn@text": {
    "properties": [
      "inputType",
      "placeHolder"
    ]
  },
  "matrixdropdowncolumn@comment": {
    "properties": [
      "placeHolder"
    ]
  },
  "panel": {
    "properties": [
      "name",
      "title",
      {
        "name": "visible",
        "category": "checks"
      }
    ],
    "tabs": [
      {
        "name": "visibleIf",
        "index": 100
      }
    ]
  }
}