Chrome ignores autocomplete="off" at the form level so in order to prevent chrome from displaying prefilled options from it's own list of autocomplete values (those cached at the client), I've been using autocomplete="false" in text boxes. This is a hack so that chrome doesn't use the client's cached list of values because "false" isn't a supported value for that attribute which blocks chrome from using it.
However, this hack doesn't work with the p-dropdown.
How can we turn off chrome's built in autocomplete for p-dropdowns?
How to turn off chrome's autocomplete in p-dropdown?
I don't know what you mean. The dropdown is rendered onto the DOM as an input control, a down arrow button and a list box. How do I inject an attribute into the rendered input control of p-dropdown?
Edit:
I figured it out. I was able to inject the attribute to the input element of the dropdown as follows:
HTML:
-----------
<p-dropdown #stateDropdown
editable="true"
[options]="states"
optionValue="value"
optionLabel="value"
formControlName="state">
</p-dropdown>
Component:
---------
@ViewChild(Dropdown) stateDropdown: Dropdown;
ngAfterViewInit() {
this.stateDropdown.renderer.setAttribute(
this.stateDropdown.editableInputViewChild.nativeElement,
"autocomplete",
"no");
}
Edit:
I figured it out. I was able to inject the attribute to the input element of the dropdown as follows:
HTML:
-----------
<p-dropdown #stateDropdown
editable="true"
[options]="states"
optionValue="value"
optionLabel="value"
formControlName="state">
</p-dropdown>
Component:
---------
@ViewChild(Dropdown) stateDropdown: Dropdown;
ngAfterViewInit() {
this.stateDropdown.renderer.setAttribute(
this.stateDropdown.editableInputViewChild.nativeElement,
"autocomplete",
"no");
}
-
- Information
-
Who is online
Users browsing this forum: No registered users and 3 guests