Fix #3148: Radio/Checkbox do not fire onChange if value has not chang…

…ed (#3149)
primefaces · Aug 9, 2022 · e69effc · e69effc
1 parent 3dbe7d0
commit e69effc
Show file tree

Hide file tree

Showing 4 changed files with 36 additions and 28 deletions.
diff --git a/components/lib/checkbox/Checkbox.d.ts b/components/lib/checkbox/Checkbox.d.ts
@@ -3,7 +3,7 @@ import TooltipOptions from '../tooltip/tooltipoptions';
 import { IconType } from '../utils';
 
 interface CheckboxChangeTargetOptions {
-    type: 'checkbox';
+    type: string;
     name: string;
     id: string;
     value: any;

diff --git a/components/lib/checkbox/Checkbox.js b/components/lib/checkbox/Checkbox.js
@@ -11,24 +11,26 @@ export const Checkbox = React.memo(React.forwardRef((props, ref) => {
     const onClick = (event) => {
         if (!props.disabled && !props.readOnly && props.onChange) {
             const checked = isChecked();
-            const value = checked ? props.falseValue : props.trueValue;
 
-            props.onChange({
-                originalEvent: event,
-                value: props.value,
-                checked: value,
-                stopPropagation: () => { },
-                preventDefault: () => { },
-                target: {
-                    type: 'checkbox',
-                    name: props.name,
-                    id: props.id,
+            if (inputRef.current.checked === checked) {
+                const value = checked ? props.falseValue : props.trueValue;
+                props.onChange({
+                    originalEvent: event,
                     value: props.value,
                     checked: value,
-                }
-            });
+                    stopPropagation: () => { },
+                    preventDefault: () => { },
+                    target: {
+                        type: 'checkbox',
+                        name: props.name,
+                        id: props.id,
+                        value: props.value,
+                        checked: value,
+                    }
+                });
+                inputRef.current.checked = !checked;
+            }
 
-            inputRef.current.checked = !checked;
             DomHandler.focus(inputRef.current);
             event.preventDefault();
         }

diff --git a/components/lib/radiobutton/RadioButton.d.ts b/components/lib/radiobutton/RadioButton.d.ts
@@ -2,6 +2,7 @@ import * as React from 'react';
 import TooltipOptions from '../tooltip/tooltipoptions';
 
 interface RadioButtonChangeTargetOptions {
+    type: string;
     name: string;
     id: string;
     value: any;

diff --git a/components/lib/radiobutton/RadioButton.js b/components/lib/radiobutton/RadioButton.js
@@ -14,21 +14,26 @@ export const RadioButton = React.memo(React.forwardRef((props, ref) => {
 
     const onClick = (e) => {
         if (!props.disabled && props.onChange) {
-            props.onChange({
-                originalEvent: e,
-                value: props.value,
-                checked: !props.checked,
-                stopPropagation: () => { },
-                preventDefault: () => { },
-                target: {
-                    name: props.name,
-                    id: props.id,
+            const checked = props.checked;
+            if (inputRef.current.checked === checked) {
+                const value = !checked
+                props.onChange({
+                    originalEvent: e,
                     value: props.value,
-                    checked: !props.checked
-                }
-            });
+                    checked: value,
+                    stopPropagation: () => { },
+                    preventDefault: () => { },
+                    target: {
+                        type: 'radio',
+                        name: props.name,
+                        id: props.id,
+                        value: props.value,
+                        checked: value,
+                    }
+                });
+                inputRef.current.checked = value;
+            }
 
-            inputRef.current.checked = !props.checked;
             DomHandler.focus(inputRef.current);
             e.preventDefault();
         }