PolymerElements/gold-phone-input

Name: gold-phone-input

Owner: PolymerElements

Description: An input element that only allows phone numbers

Created: 2015-05-07 21:10:31.0

Updated: 2018-04-11 00:10:42.0

Pushed: 2018-05-23 02:25:53.0

Homepage: https://elements.polymer-project.org/elements/gold-phone-input?view=demo:demo/index.html

Size: 136

Language: HTML

GitHub Committers

UserMost Recent Commit# Commits

Other Committers

UserEmailMost Recent Commit# Commits

README

Build status Demo and API Docs

<gold-phone-input>

<gold-phone-input> is a single-line text field with Material Design styling for entering a phone number.

d-phone-input></gold-phone-input>

It may include an optional label, which by default is “Phone number”.

d-phone-input label="call this"></gold-phone-input>
Validation

By default, the phone number is considered to be a US phone number, and will be validated according to the pattern XXX-XXX-XXXX, where X is a digit, and - is the separating dash. If you want to customize the input for a different area code or number pattern, use the country-code and phone-number-pattern attributes

d-phone-input
country-code="33"
phone-number-pattern="X-XX-XX-XX-XX">
ld-phone-input>

The input can be automatically validated as the user is typing by using the auto-validate and required attributes. For manual validation, the element also has a validate() method, which returns the validity of the input as well sets any appropriate error messages and styles.

See Polymer.PaperInputBehavior for more API docs.

Styling

See Polymer.PaperInputContainer for a list of custom properties used to style this element.

--gold-phone-input-country-code | Mixin applied to the country code span


This work is supported by the National Institutes of Health's National Center for Advancing Translational Sciences, Grant Number U24TR002306. This work is solely the responsibility of the creators and does not necessarily represent the official views of the National Institutes of Health.