diff --git a/src/core/annotation.js b/src/core/annotation.js
index 569a7bcab5b7a6..2150a82fc8a0b8 100644
--- a/src/core/annotation.js
+++ b/src/core/annotation.js
@@ -1076,6 +1076,7 @@ class ButtonWidgetAnnotation extends WidgetAnnotation {
         break;
       }
     }
+    this.checkedAppearance = normalAppearanceState.get(this.data.buttonValue);
   }
 
   _processPushButton(params) {
diff --git a/src/display/annotation_layer.js b/src/display/annotation_layer.js
index d209c595fd9b81..a5a1f5bc567805 100644
--- a/src/display/annotation_layer.js
+++ b/src/display/annotation_layer.js
@@ -584,15 +584,32 @@ class RadioButtonWidgetAnnotationElement extends WidgetAnnotationElement {
    */
   render() {
     this.container.className = "buttonWidgetAnnotation radioButton";
+    const storage = this.annotationStorage;
+    const data = this.data;
+    const id = data.id;
+    const value = storage.getOrCreateValue(id, data.fieldValue === data.buttonValue);
 
     const element = document.createElement("input");
-    element.disabled = this.data.readOnly;
+    element.disabled = data.readOnly;
     element.type = "radio";
-    element.name = this.data.fieldName;
-    if (this.data.fieldValue === this.data.buttonValue) {
+    element.name = data.fieldName;
+    if (value) {
       element.setAttribute("checked", true);
     }
 
+    element.addEventListener("change", function (event) {
+      const name = event.target.name;
+      for (const el of document.getElementsByName(name)) {
+        if (el !== event.target) {
+          storage.setValue(
+            el.parentNode.getAttribute("data-annotation-id"),
+            false
+          );
+        }
+      }
+      storage.setValue(id, event.target.checked);
+    });
+
     this.container.appendChild(element);
     return this.container;
   }