diff --git a/framework/core/js/src/common/components/Input.tsx b/framework/core/js/src/common/components/Input.tsx
index 2605582eca..75387b1261 100644
--- a/framework/core/js/src/common/components/Input.tsx
+++ b/framework/core/js/src/common/components/Input.tsx
@@ -52,7 +52,10 @@ export default class Input<CustomAttrs extends IInputAttrs = IInputAttrs> extend
         {this.attrs.clearable && value && !this.attrs.loading ? (
           <Button
             className="Input-clear Button Button--icon Button--link"
-            onclick={this.clear.bind(this)}
+            onclick={(e: MouseEvent) => {
+              e.stopPropagation();
+              this.clear();
+            }}
             aria-label={this.attrs.clearLabel || app.translator.trans('core.lib.input.clear_button')}
             type="button"
             icon="fas fa-times-circle"