formio / formio.js

JavaScript powered Forms with JSON Form Builder
https://formio.github.io/formio.js
MIT License
1.83k stars 1.04k forks source link

Having issues while adding additional properties to Textfield component configuration model #5662

Open prabhjotkaur10 opened 1 week ago

prabhjotkaur10 commented 1 week ago

I have a Custom Text field component, which is. created by extending Textfield component as follows,

`/ tslint:disable /

import TextField from 'formiojs/components/textfield/TextField';
import editForm from './editForm';

export default class CustomTextField extends TextField {
  static schema(...extend) {
    return TextField.schema(
      { 
        input: false,
        persistent: false,
      },
      ...extend
    );
  }

  static editForm = editForm;

  static get builderInfo() {
    return {
      title: 'Text field',
      group: 'basic',
      icon: 'code',
      weight: 70,
      schema: CustomTextField.schema(),
    };
  }
}

` editform.js is as follows

import baseEditForm from 'formiojs/components/_classes/component/Component.form';

export default (...extend) => {
  return baseEditForm(
    [
      {
        key: 'display',
        components: [
          {
            // You can ignore existing fields.
            key: 'placeholder',
            ignore: true,
          },
          {
            // Or add your own. The syntax is form.io component definitions.
            type: 'textfield',
            input: true,
            label: 'My Custom Setting',
            weight: 12,
            key: 'myCustomSetting', // This will be available as component.myCustomSetting
          },
        ],
      },
      {
        key: 'data',
        components: [],
      },
      {
        key: 'validation',
        components: [],
      },
      {
        key: 'api',
        components: [],
      },
      {
        key: 'conditional',
        components: [],
      },
      {
        key: 'logic',
        components: [],
      },
    ],
    ...extend
  );
};

`

The above configuration is not adding the custom property to the configuration model while I try to add the custom text field. What is the correct way to do it?

Thanks!