Cancel
Showing results for 
Show  only  | Search instead for 
Did you mean: 

Question about hiding/displaying Settings components

ANSWERED

I have a TextArea on my Settings index.jsx. I can disable or enable the component based on a user selection but I would like to "hide" or not display the TextArea instead of just disabling it. Is this possible?

Best Answer
0 Votes
1 BEST ANSWER

Accepted Solutions

I got this to work using the code below in my index.jsx file. If the Select component has a value of 'testing', then the TextInput component will be displayed.

 

{
(typeof props.settings.format !== constants.UNDEFINED && JSON.parse(props.settings.format).values[0].value === 'testing') && <TextInput type="text" maxLength="10" label="Test Label" settingsKey="testing" />
}

View best answer in original post

Best Answer
0 Votes
3 REPLIES 3

This can be done. See the Toggle examples.

Peter McLennan
Gondwana Software
Best Answer
0 Votes

I assume you are referring to the Toggle sample below? If so, can you explain how this hides/displays the Toggle? I'm missing something, thank you. ( (I had to remove HTML from the code snippet so I could post the code.)

 

<Toggle
  settingsKey="toggle"
  label="Toggle Switch"
/>

{ JSON.parse(settings.toggle || 'false') and <Toggle settingsKey="hiddenToggle" /> }

  

Best Answer
0 Votes

I got this to work using the code below in my index.jsx file. If the Select component has a value of 'testing', then the TextInput component will be displayed.

 

{
(typeof props.settings.format !== constants.UNDEFINED && JSON.parse(props.settings.format).values[0].value === 'testing') && <TextInput type="text" maxLength="10" label="Test Label" settingsKey="testing" />
}

Best Answer
0 Votes