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: Dropdown - If editable is true and optionValue is present, the selected option will not be shown #14427

Closed
dumitru-tabara-dev opened this issue Dec 25, 2023 · 3 comments
Assignees
Labels
Type: Bug Issue contains a bug related to a specific component. Something about the component is not working
Milestone

Comments

@dumitru-tabara-dev
Copy link

Describe the bug

If the "enabled" flag is se to true and the optionValue is different than the default value('value') then after selecting an option in the dropdown, the selected option will not be visible in the UI.

dropdown

The stackblitz file contains two cases: the first one is working and the second one is not working because of the optionValue.

Environment

Angular 17.0.8 + PrimeNG 17.2.0

Reproducer

https://stackblitz.com/edit/unjmt9-fsxjbz?file=src%2Fapp%2Fdemo%2Fdropdown-editable-component.html

Angular version

17.0.8

PrimeNG version

17.2.0

Build / Runtime

Angular CLI App

Language

TypeScript

Node version (for AoT issues node --version)

18.18.0

Browser(s)

Chrome 120.0

Steps to reproduce the behavior

No response

Expected behavior

No response

@dumitru-tabara-dev dumitru-tabara-dev added the Status: Needs Triage Issue will be reviewed by Core Team and a relevant label will be added as soon as possible label Dec 25, 2023
@cetincakiroglu cetincakiroglu added this to the 17.3.0 milestone Dec 26, 2023
@cetincakiroglu cetincakiroglu removed the Status: Needs Triage Issue will be reviewed by Core Team and a relevant label will be added as soon as possible label Dec 28, 2023
@cetincakiroglu
Copy link
Contributor

cetincakiroglu commented Dec 28, 2023

Hi,

Thanks for reporting, we've fixed the issue. optionValue property should be ignored when editable is set to true. You don't need to provide optionValue if the dropdown is editable. Only optionLabel is required if the options are not in string format. Do not forget to set autofocusFilter to false if you don't want to focus on filter input when editable input changed.

@cetincakiroglu cetincakiroglu self-assigned this Dec 28, 2023
@cetincakiroglu cetincakiroglu added the Type: Bug Issue contains a bug related to a specific component. Something about the component is not working label Dec 28, 2023
@dumitru-tabara-dev
Copy link
Author

Hi @cetincakiroglu ,
What if I want to set the value of the selected input but not the label in my reactive form field?
An example:
I have an object like this in my array: { fieldName: "SomethingName", fieldValue: "SomethingValue" }.
And i have the following attributes set in my dropdown:
"formControlName"="myFormProp"
"editable"=true
"optionLabel"="fieldName"
"optionValue"="fieldValue"

When I select an option from the dropdown I'm expecting myFormProp from the formGroup to contain "SomethingValue", not "SomethingName".
But if I type something in the dropdown, for example: "Some typing", I'm expecting myFormProp = "Some typing".

I hope it makes sense, this is why I specify the optionValue, and it used to work as expected before.

@cetincakiroglu
Copy link
Contributor

cetincakiroglu commented Dec 28, 2023

Checked the previous versions, optionValue omitted there if the input is editable, even if it provided, component was using optionLabel in editable.

Could you please create a new issue for that with the stackblitz reproducer so we can investigate the behavior?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Type: Bug Issue contains a bug related to a specific component. Something about the component is not working
Projects
None yet
Development

No branches or pull requests

2 participants