primefaces / primeng

The Most Complete Angular UI Component Library
https://primeng.org
Other
10.44k stars 4.6k forks source link

Component: Checkbox #15033

Open lemonCMS opened 7 months ago

lemonCMS commented 7 months ago

Describe the bug

Update triggered twice

When having a p-checkbox with a formControl and the value attribute populated, then the control get updated twice

` <p-checkbox [formControl]="fc2" [value]="1" inputId="binary" [label]="'Label 2'"

`

this.fc2.valueChanges.subscribe(console.log);

Clicking the checkbox will result in two updates.

When you have the checkbox set to binary this does not happen.

Environment

The primeNG test environment

Reproducer

https://stackblitz.com/edit/d6vkvb?file=src%2Fapp%2Fdemo%2Fcheckbox-basic-demo.html

Angular version

17

PrimeNG version

17

Build / Runtime

Angular CLI App

Language

TypeScript

Node version (for AoT issues node --version)

18.8.0

Browser(s)

Chrome

Steps to reproduce the behavior

See the provided example repo

Expected behavior

To only receive one update

abdallahmmu commented 7 months ago

remove the value property binding of 1 and make sure your initial value throw the formControl it will take the job and make the binding

lemonCMS commented 7 months ago

We need to have the value property binding. In the my example only one checkbox is shown, but in the application we have a list of checkboxes binded to the same formControl.

abdallahmmu commented 7 months ago

if so you need to bind all the checkboxes to the same form control but keep in mind this will reflect all the checkboxes value once any one triggered to true.

also if you try to make a multiple choices using checkboxes then I suggest to use a form array. instead of form control