Skip to content

feat(material/form-field-custom-control): custom phone input autoadvance #19650

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 4 commits into from
Jun 17, 2020
Merged

feat(material/form-field-custom-control): custom phone input autoadvance #19650

merged 4 commits into from
Jun 17, 2020

Conversation

Wildhammer
Copy link
Contributor

@Wildhammer Wildhammer commented Jun 15, 2020

Automatically focus the next input when done with the previous one. Allow autofocusing backward when pressing backspace. onContainerClick now focuses on the last filled input on click. Using maxLength on the inputs to not allow more characters than the size of the input.
https://medium.com/@wildhammer/angular-material-phone-input-2283c7bc3372

Fixes #13195

Automatically focus the next input when done with the previous one. Allow autofocusing backward when pressing backspace. onContainerClick now focuses on the last filled input on click. Using maxLength on the inputs to not allow more characters than the size of the input.

Fixes #13195
@Wildhammer Wildhammer requested a review from jelbourn as a code owner June 15, 2020 16:47
@googlebot googlebot added the cla: yes PR author has agreed to Google's Contributor License Agreement label Jun 15, 2020
@jelbourn jelbourn requested review from mmalerba and removed request for jelbourn June 15, 2020 18:28
Copy link
Contributor

@mmalerba mmalerba left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Nice, thanks for making this demo a little more full featured

…umber input

Updates styling for form-field-custom-control-example component, multi-line elements in template due to them getting long, argument spacing.

Fixes #13195
@Wildhammer
Copy link
Contributor Author

@mmalerba thanks for your feedback. I applied the requested changes.

Copy link
Contributor

@mmalerba mmalerba left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM, thanks! - 1 more minor nit then it's good to go

@mmalerba mmalerba added docs This issue is related to documentation lgtm labels Jun 17, 2020
@mmalerba mmalerba added action: merge The PR is ready for merge by the caretaker target: patch This PR is targeted for the next patch release labels Jun 17, 2020
@mmalerba mmalerba added merge: fix commit message When the PR is merged, rewrites/fixups of the commit messages are needed target: minor This PR is targeted for the next minor release and removed target: patch This PR is targeted for the next patch release labels Jun 17, 2020
@mmalerba mmalerba merged commit b8fba33 into angular:master Jun 17, 2020
devversion pushed a commit to devversion/material2 that referenced this pull request Jun 18, 2020
…nce (angular#19650)

* feat(material/form-field-custom-control): custom phone input autoadvance

Automatically focus the next input when done with the previous one. Allow autofocusing backward when pressing backspace. onContainerClick now focuses on the last filled input on click. Using maxLength on the inputs to not allow more characters than the size of the input.

Fixes angular#13195

* style(material/form-field-custom-control): styling update for phone number input

Updates styling for form-field-custom-control-example component, multi-line elements in template due to them getting long, argument spacing.

Fixes angular#13195

* style(material/form-field-custom-control): removes unnecessary !! from autoFocusNext

* Merge remote-tracking branch 'upstream/master' into phone-input-auto-advance
@angular-automatic-lock-bot
Copy link

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

This action has been performed automatically by a bot.

@angular-automatic-lock-bot angular-automatic-lock-bot bot locked and limited conversation to collaborators Jul 18, 2020
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
action: merge The PR is ready for merge by the caretaker cla: yes PR author has agreed to Google's Contributor License Agreement docs This issue is related to documentation merge: fix commit message When the PR is merged, rewrites/fixups of the commit messages are needed target: minor This PR is targeted for the next minor release
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Custom Form Field (phone example bugs/feature enhancements)
3 participants