Question T14777
Visible to All Users

How to set and hide some settings from the property grid in latest version

created a year ago

Hello,

As I'm evaluating SurveyJS (prior to getting a commercial license), and the docs have many examples using old versions as well, I find myself searching all over the place.

Curious, how to fully hide/remove the options in the general tab indicated with a red rectangle?

Ideally, these options are not visible at all, and are set as follows:

  • title always shows
  • language is "en"
  • the survey is editable (but later I may change it to read-only if someone is viewing their survey after completion)
  • no cookie name
  • width is responsive
  • fit to container is checked (I've played around with this option and did not see a difference)

Here's my current setup:

JavaScript
import 'survey-core/defaultV2.min.css'; import 'survey-creator-core/survey-creator-core.min.css'; import { SurveyCreator, SurveyCreatorComponent } from 'survey-creator-react'; //import { Serializer } from 'survey-creator-core'; const questionTypes = [ 'question', 'text', 'checkbox', 'radiogroup', 'dropdown', 'boolean', 'matrix', 'rating', 'ranking', 'comment', 'panel', 'html', ]; const options = { showJSONEditorTab: false, showLogicTab: false, showPreviewTab: false, showToolbox: false, isAutoSave: true, questionTypes: questionTypes, }; const SurveyDesign = () => { const creator = new SurveyCreator(options); creator.onPropertyGridSurveyCreated.add((sender, options) => { const generalTab = options.survey.getPanelByName('general'); const logicTab = options.survey.getPanelByName('logic'); const completedTab = options.survey.getPanelByName('showOnCompleted'); const timerTab = options.survey.getPanelByName('timer'); // showTimerPanel if (completedTab) { completedTab.delete(); } if (timerTab) { timerTab.delete(); } }); creator.JSON = {}; return ( <div className="att-survey-designer" style={{ height: '80vh' }}> <SurveyCreatorComponent creator={creator} /> </div> ); }; export default SurveyDesign;
Show previous comments (1)
AT AT
Andrew Telnov a year ago

    Hello Petar,
    You can iterate through all panels to find out their names using this code:
    options.survey.getAllPanels().forEach(p => console.log("Name: " + p.name + ", title: " + p.title));.

    To hide individual properties, you can use creator.onShowingProperty event, as shown in this example.

    Thank you,
    Andrew
    SurveyJS Team

      Thanks Andrew.

      AT AT
      Andrew Telnov a year ago

        You are welcome!

        Thank you,
        Andrew
        SurveyJS Team