Skip to content
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

Component: InputMask #13798

Closed
pastpap opened this issue Oct 4, 2023 · 2 comments
Closed

Component: InputMask #13798

pastpap opened this issue Oct 4, 2023 · 2 comments
Labels
Status: Discussion Issue or pull request needs to be discussed by Core Team Status: Needs Triage Issue will be reviewed by Core Team and a relevant label will be added as soon as possible Type: New Feature Issue contains a new feature or new component request

Comments

@pastpap
Copy link

pastpap commented Oct 4, 2023

Describe the feature you would like to see added

Two new attributes for the component to transmit down to the child element.

Attribute list:

  1. aria-autocomplete - string | none, inline, list, both
  2. spellcheck - boolean | true, false

We realize that these are not part of the tag specification. Nevertheless they seem to do the trick when it comes to Edge.

Is your feature request related to a problem?

When opening a page that contains InputMasks with the Microsoft Edge browser the private info of the user is suggested for autocompleting the input.
This happens even with the autocomplete attribute already set to "off".
What was observed is that using aria-autocomplete eliminates this bug from edge.

Sometimes the Edge browser will also trigger a pop-up with suggested values if the spellcheck is not set to false.

Describe the solution you'd like

Having the two extra attributes being passed down to the child element of this component would fix the problem.

Describe alternatives you have considered

What we used as an alternative was to create a directive with access to the InputMask component and querying the DOM for the child element to set the attribute after the view init event when the input is actually generated.

`
constructor(private mask: InputMask) {
}

public ngAfterViewInit(): void {
    ((this.mask.el.nativeElement as HTMLElement).firstChild as HTMLElement).setAttribute('aria-autocomplete', 'none');
}

`

But this is an ugly workaround in our opinion. :)

Additional context

image

@pastpap pastpap added Status: Discussion Issue or pull request needs to be discussed by Core Team Status: Needs Triage Issue will be reviewed by Core Team and a relevant label will be added as soon as possible Type: New Feature Issue contains a new feature or new component request labels Oct 4, 2023
@rehdie
Copy link

rehdie commented Nov 29, 2024

Another attribute, which would be useful for mobile devices: inputmode

@mertsincan
Copy link
Member

Please use PrimeNG discussion channel for the new features. Thanks you!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Status: Discussion Issue or pull request needs to be discussed by Core Team Status: Needs Triage Issue will be reviewed by Core Team and a relevant label will be added as soon as possible Type: New Feature Issue contains a new feature or new component request
Projects
None yet
Development

No branches or pull requests

3 participants