Home Reference Source Repository
public class | source

textfield

Extends:

src/utils/component.js~Component.default → textfield

UI Textfield

Example:


// simple
new mdw.Textfield({
  element: document.body.appendChild(document.createElement('div')),
  placeholder: 'Name'
})

// help text
new mdw.Textfield({
  element: document.body.appendChild(document.createElement('div')),
  placeholder: 'Name',
  text: {
    persistent: true,
    help: 'some name'
  }
})

// validation
var textfield = new mdw.Textfield({
  element: document.body.appendChild(document.createElement('div')),
  placeholder: 'Name',
  text: {
    validation: 'Please enter a valid email address'
  },
  onChange: function(email) {
    const IS_VALID_EMAIL = /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/.test(email)
    if (IS_VALID_EMAIL) {
      this.validationText = undefined
    } else {
      this.validationText = 'Please enter a valid email address'
    }
  }
})

// disable
new mdw.Textfield({
  element: document.body.appendChild(document.createElement('div')),
  disable: true,
  placeholder: 'Name',
  value: 'Boa'
})

// required
new mdw.Textfield({
  element: document.body.appendChild(document.createElement('div')),
  required: true,
  placeholder: 'Name',
  value: 'Boa'
})

Constructor Summary

Public Constructor
public

constructor(options: *)

constructor

Member Summary

Public Members
public set

set help text

public
public set

set validation text

Method Summary

Public Methods
public

empty(): void

empty

public

render(): void

render DOM elements

Public Constructors

public constructor(options: *) source

constructor

Params:

NameTypeAttributeDescription
options *

Public Members

public set helpText: * source

set help text

public textHelpElement: * source

public set validationText: * source

set validation text

Public Methods

public empty(): void source

empty

Return:

void

public render(): void source

render DOM elements

Return:

void