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 |
helpText: * set help text |
|
public |
|
|
public set |
set validation text |