CrowdsourceForm.babel.js

getFormField(field,index) {

  const self = this;

  if (this.formItemStatus[field.fieldID] === undefined) {
    this.formItemStatus[field.fieldID] = false;
  }

  const defaults = {
    contributing: true,
    required: field.required,
    formId: this._formId,
    id: field.fieldID,
    key: index,
    label: field.label,
    attribute: field.attributeName,
    validations: field.validations,
    extras: field.extras,
    handleChange: function(res) {
      if (res.valid){
        if (field.extras && field.extras.dataType) {
          switch (field.extras.dataType) {
            case 'photo':
              if (typeof res.value === 'object') {
                Object.keys(res.value).forEach((currentVal) => {
                  const value = {
                    attachment: true,
                    type: 'photo',
                    ext: res.value[currentVal].ext,
                    source: res.value[currentVal].source
                  };

                  self.graphic.attributes[currentVal] = value;
                });
              }
              break;
            case 'location':
              if (res.value.dataVal && res.value.dataVal.name) {
                self.graphic.attributes[field.fieldID] = res.value.dataVal.name;
              }
              if (field.extras.storeGeometry && res.value.dataVal && res.value.dataVal.geometry) {
                self.graphic.geometry = res.value.dataVal.geometry;
              }
              break;
          }
        } else if (res.value && !res.value.inputVal) {
          self.graphic.attributes[field.fieldID] = res.value;
        }
      }
      self.handleFieldChange(field.fieldID,res.valid);
    }
  };

  if (field.type === 'text' || field.type === 'textarea' || field.type === 'location') {
    const maxLength = this.getFieldDefinitionValue(field.fieldID,'length');
    const options = {
      inputAttr: {
        type: field.type,
        placeholder: field.placeholder,
        maxLength
      }
    };

    const settings = $.extend(true,{},defaults,options);

    switch (field.type) {
      case 'textarea':
        return <Textarea {...settings}></Textarea>;
      case 'location':
        return <Location map={this.props.map} {...settings}></Location>;
      default:
        return <Input {...settings}></Input>;
      }
  } else if (field.type === 'photo') {
    const options = {
      placeholder: field.placeholder
    };

    const settings = $.extend(true,{},defaults,options);

    settings.validations = [];

    return <Photo {...settings}></Photo>;
  } else if (field.type === 'radio-image-group') {
    
    const options = {
      options: field.options
    };

    const settings = $.extend(true,{},defaults,options);

    settings.validations = [];

    return <RadioImageGroup {...settings}></RadioImageGroup>;
  }
}