Form for DevExtreme - How to change certain Form items based on a value of another item

This example demonstrates how to show/hide or enable/disable form items based on a value of another item.

The main idea is to change the visible option of a certain form item in the onFieldDataChanged form's event handler. The same approach can be used with the disabled option of the required form item editor. We can do that using editorOptions.

In our particular case, we hide the Address form item and disable the Hire Date item editor when the Position form item value is set to "CEO".

Files to Review

• Angular
  • app.component.html
  • app.component.ts
• jQuery
  • index.js
• React
  • App.js
• Vue
  • App.vue

Documentation

• Getting Started with Form

• Form - API Reference