Implement customisations to Properties/Questions
joshreid opened this issue · 3 comments
I'm having difficulty implementing customisations as per the docs - may be react usage specific?
http://editor.surveyjs.io/examples/questioneditor.html#code
Could you let me know if there's something I'm missing or how to implement in the following case?
Survey is not referenced elsewhere in this file - is it used internally by SurveyJSEditor?
Thanks in advance.
let editorOptions = { showEmbededSurveyTab: false, showJSONEditorTab:true, questionTypes:[ 'text', 'checkbox', 'radiogroup', 'dropdown', 'multipletext' ] }
// These make no difference to the editor...
//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
SurveyJSEditor.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
SurveyJSEditor.SurveyQuestionEditorDefinition.definition["questionbase"].tabs = [{name: "visibleIf", index: 1}];
// Instantiate Editor
this.editor = new SurveyJSEditor.SurveyEditor('surveyEditorContainer', editorOptions)
// This does work as it should...
this.editor.onCanShowProperty.add(function(sender, options){
if(options.obj.getType() === 'survey') {
options.canShow = options.property.name === 'title'
}
if(options.obj.getType() === 'page') {
// Hide these options
options.canShow = [ 'navigationButtonsVisibility', 'width' ].indexOf(options.property.name) < 0
}
})
You need just add import directive in the https://github.com/surveyjs/surveyjs_react_quickstart/blob/master/src/SurveyEditor.js file to access Survey:
import * as Survey from 'survey-knockout';
Then you can use Survey for settings:
Survey.JsonObject.metaData.addProperty("questionbase", "tag");
Note, that Survey JS editor is using KnockoutJS platform of the SurveyJS library. That's why I wrote import from 'survey-knockout'.
Yes, Survey is used internally by Survey JS editor.
Ah that was why - I was importing Survey from 'survey-react' as per the implementation in app.js - https://github.com/surveyjs/surveyjs_react_quickstart/blob/master/src/App.js
Thanks this is working as expected now.
I was trying to customize questions/properties in react-surveyjs editor.
I required survey-knockout
package.But now I am getting this error.
Uncaught Error: Component survey is already registered
at Object.ko.components.register (knockout.ts:60)
at Object.<anonymous> (knockout.ts:60)
at __webpack_require__ (knockout.ts:60)
at Object.<anonymous> (knockout.ts:60)
at __webpack_require__ (knockout.ts:60)
at __webpack_exports__.b (knockout.ts:60)
at knockout.ts:60
at webpackUniversalModuleDefinition (knockout.ts:60)
at Object.<anonymous> (knockout.ts:60)
at __webpack_require__ (bootstrap 23ee73db2ae19b465b9b:9)
I guess this issue is because of conflict between survey-react and survey-knockout packages.
Could you let me know how to use both of them in single App.