updatePreview($field) {
    const _this = this
    const fieldClass = $field.attr('class')
    const field = $field[0]
    if (fieldClass.includes('input-control')) {
      return
    }

    const fieldType = $field.attr('type')
    const $prevHolder = $('.prev-holder', field)
    let previewData = Object.assign({}, _this.getAttrVals(field), { type: fieldType })

    $field.find('.form-group.field-options').each((_, attribute) => {
      const attributeName = attribute.getAttribute('name')
      previewData[attributeName] = _this.fieldOptionData(attribute)
    })

    previewData = trimObj(previewData, true)

    previewData.className = _this.classNames(field, previewData)

    $field.data('fieldData', previewData)

    // determine the control class for this type, and then process it through the layout engine
    const custom = _this.formBuilder.controls.custom.lookup(previewData.type)
    const template = _this.formBuilder.controls.custom.getClass(previewData.type)
    const controlClass = custom ? custom.class : template || control.getClass(previewData.type, previewData.subtype)
    const preview = this.layout.build(controlClass, previewData)

    empty($prevHolder[0])
    $prevHolder[0].appendChild(preview)
    preview.dispatchEvent(new Event('fieldRendered', { bubbles: true, cancelable: false} ))
  }
Collect field attribute values and call fieldPreview to generate preview
@param  {Object} $field jQuery DOM element