How to use the @covalent/dynamic-forms.TdDynamicElement.Input function in @covalent/dynamic-forms

To help you get started, we’ve selected a few @covalent/dynamic-forms examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github nhsconnect / careconnect-reference-implementation / ccri-management-app / src / main / web / src / app / component / resource / resource.component.ts View on Github external
this.elements.push(nodeDSQ);
         this.elements.push(nodeDS);

         break;
       case 'token' :
         // add matches
         let nodeT1 :ITdDynamicElementConfig = {
           "label": 'System - '+param.name + ' - '+param.documentation,
           "name" : param.type+'-'+seq + '-1-'+param.name,
           "type": TdDynamicElement.Input,
           "flex" : 50
         };
         let nodeT2 :ITdDynamicElementConfig = {
           "label": 'Code - '+param.name + ' - '+param.documentation,
           "name" : param.type+'-'+seq + '-2-'+param.name,
           "type": TdDynamicElement.Input,
           "flex" : 50
         };
         this.elements.push(nodeT1);
         this.elements.push(nodeT2);
         break;
       case 'string' :
         // add matches
         let nodeOpt: ITdDynamicElementConfig = {
           "label": "match",
           "name": param.type+'-'+seq + '-1-'+param.name,
           "type": TdDynamicElement.Select,
           "selections": [
           {
             "label": "Matches",
             "value": ""
           },
github Teradata / covalent / src / app / components / components / component-demos / dynamic-forms / dynamic-forms.component.ts View on Github external
default: ['list1'],
      selections: ['list1', 'list2', 'list3'],
      flex: 100,
      validators: [
        {
          validator: (control: AbstractControl) => {
            let isValid: boolean = control.value.length <= 2;
            return !isValid ? { invalidChips: true } : undefined;
          },
        },
      ],
    },
  ];

  elementOptions: any[] = [
    TdDynamicElement.Input,
    TdDynamicType.Number,
    TdDynamicElement.Datepicker,
    TdDynamicElement.Password,
    TdDynamicElement.Textarea,
    TdDynamicElement.Slider,
    TdDynamicElement.Checkbox,
    TdDynamicElement.SlideToggle,
    TdDynamicElement.FileInput,
  ];

  showDynamicCode: boolean = false;

  type: any;

  count: number = 2;
github Teradata / covalent / src / app / components / components / dynamic-forms / dynamic-forms.component.ts View on Github external
hint: 'this is an input hint',
      type: TdDynamicElement.Input,
      required: false,
      flex: 50,
    },
    {
      name: 'required-input',
      label: 'Input Label',
      type: TdDynamicElement.Input,
      required: true,
      flex: 50,
    },
    {
      name: 'text-length',
      label: 'Text Length',
      type: TdDynamicElement.Input,
      minLength: 4,
      maxLength: 12,
      flex: 50,
    },
    {
      name: 'text',
      type: TdDynamicType.Text,
      required: false,
      default: 'Default',
      flex: 50,
      disabled: true,
    },
    {
      name: 'textarea',
      hint: 'this is a textarea hint',
      type: TdDynamicElement.Textarea,
github nhsconnect / careconnect-reference-implementation / ccri-management-app / src / main / web / src / app / component / resource / resource.component.ts View on Github external
"label": "Matches",
             "value": ""
           },
           {
             "label": "Exactly",
             "value": "exact"
           }
         ],
           "required": true
           ,"flex" : 20
         };

         let nodeS :ITdDynamicElementConfig = {
           "label": param.name + ' - '+param.documentation,
           "name" : param.type+'-'+seq + '-2-'+param.name,
           "type": TdDynamicElement.Input,
           "required": true,
           "flex" : 80
         };
          this.elements.push(nodeOpt);
         this.elements.push(nodeS);
         break;
       case 'reference' :
         let nodeR :ITdDynamicElementConfig = {
           "label": param.name + ' - '+param.documentation,
           "name" : param.type+'-'+seq + '-1-'+param.name,
           "type": TdDynamicElement.Input,
           "required": true,
         };
         this.elements.push(nodeR);
         break;
github Teradata / covalent / src / app / components / components / dynamic-forms / dynamic-forms.component.ts View on Github external
default: ['list1'],
      selections: ['list1', 'list2', 'list3'],
      flex: 100,
      validators: [
        {
          validator: (control: AbstractControl) => {
            const isValid: boolean = control.value.length <= 2;
            return !isValid ? { invalidChips: true } : undefined;
          },
        },
      ],
    },
  ];

  elementOptions: any[] = [
    TdDynamicElement.Input,
    TdDynamicType.Number,
    TdDynamicElement.Datepicker,
    TdDynamicElement.Password,
    TdDynamicElement.Textarea,
    TdDynamicElement.Slider,
    TdDynamicElement.Checkbox,
    TdDynamicElement.SlideToggle,
    TdDynamicElement.FileInput,
  ];

  showDynamicCode: boolean = false;

  type: any;

  count: number = 2;
github Teradata / covalent / src / app / content / components / component-demos / dynamic-forms / demos / dynamic-forms-demo-basic / dynamic-forms-demo-basic.component.ts View on Github external
templateUrl: './dynamic-forms-demo-basic.component.html',
  preserveWhitespaces: true,
})
export class DynamicFormsDemoBasicComponent {
  textElements: ITdDynamicElementConfig[] = [
    {
      name: 'input',
      hint: 'this is an input hint',
      type: TdDynamicElement.Input,
      required: false,
      flex: 50,
    },
    {
      name: 'required-input',
      label: 'Input Label',
      type: TdDynamicElement.Input,
      required: true,
      flex: 50,
    },
    {
      name: 'text-length',
      label: 'Text Length',
      type: TdDynamicElement.Input,
      minLength: 4,
      maxLength: 12,
      flex: 50,
    },
    {
      name: 'text',
      type: TdDynamicType.Text,
      required: false,
      default: 'Default',
github Teradata / covalent / src / app / components / components / dynamic-forms / dynamic-forms.component.ts View on Github external
selector: 'dynamic-forms-demo',
  styleUrls: ['./dynamic-forms.component.scss'],
  templateUrl: './dynamic-forms.component.html',
  animations: [slideInDownAnimation, tdCollapseAnimation],
  preserveWhitespaces: true,
})
export class DynamicFormsDemoComponent {
  @ViewChild('manualValidateForm', { static: true }) manualValidateForm: TdDynamicFormsComponent;
  @HostBinding('@routeAnimation') routeAnimation: boolean = true;
  @HostBinding('class.td-route-animation') classAnimation: boolean = true;

  textElements: ITdDynamicElementConfig[] = [
    {
      name: 'input',
      hint: 'this is an input hint',
      type: TdDynamicElement.Input,
      required: false,
      flex: 50,
    },
    {
      name: 'required-input',
      label: 'Input Label',
      type: TdDynamicElement.Input,
      required: true,
      flex: 50,
    },
    {
      name: 'text-length',
      label: 'Text Length',
      type: TdDynamicElement.Input,
      minLength: 4,
      maxLength: 12,
github Teradata / covalent / src / app / components / components / component-demos / dynamic-forms / dynamic-forms.component.ts View on Github external
hint: 'this is an input hint',
      type: TdDynamicElement.Input,
      required: false,
      flex: 50,
    },
    {
      name: 'required-input',
      label: 'Input Label',
      type: TdDynamicElement.Input,
      required: true,
      flex: 50,
    },
    {
      name: 'text-length',
      label: 'Text Length',
      type: TdDynamicElement.Input,
      minLength: 4,
      maxLength: 12,
      flex: 50,
    },
    {
      name: 'text',
      type: TdDynamicType.Text,
      required: false,
      default: 'Default',
      flex: 50,
      disabled: true,
    },
    {
      name: 'textarea',
      hint: 'this is a textarea hint',
      type: TdDynamicElement.Textarea,