diff --git a/ui-ngx/src/app/modules/home/components/widget/config/datasources.component.ts b/ui-ngx/src/app/modules/home/components/widget/config/datasources.component.ts
index dd9873e4b9..f8d5064860 100644
--- a/ui-ngx/src/app/modules/home/components/widget/config/datasources.component.ts
+++ b/ui-ngx/src/app/modules/home/components/widget/config/datasources.component.ts
@@ -150,7 +150,8 @@ export class DatasourcesComponent implements ControlValueAccessor, OnInit, Valid
 
   datasourcesMode: DatasourceType;
 
-  private propagateChange = (_val: any) => {};
+  private propagateChange: (value: any) => void;
+  private propagateChangePending = false;
 
   constructor(private fb: UntypedFormBuilder,
               private utils: UtilsService,
@@ -161,7 +162,7 @@ export class DatasourcesComponent implements ControlValueAccessor, OnInit, Valid
 
   registerOnChange(fn: any): void {
     this.propagateChange = fn;
-    if (this.validate(null)) {
+    if (this.propagateChangePending) {
       setTimeout(() => {
         this.datasourcesUpdated(this.datasourcesFormGroup.get('datasources').value);
       }, 0);
@@ -227,7 +228,7 @@ export class DatasourcesComponent implements ControlValueAccessor, OnInit, Valid
     if (this.singleDatasource && !this.datasourcesFormArray.length) {
       this.addDatasource(false);
     }
-    if (changed) {
+    if (changed || this.validate(null)) {
       setTimeout(() => {
         this.datasourcesUpdated(this.datasourcesFormGroup.get('datasources').value);
       }, 0);
@@ -329,7 +330,12 @@ export class DatasourcesComponent implements ControlValueAccessor, OnInit, Valid
     if (this.datasourcesOptional) {
       datasources = datasources ? datasources.filter(d => datasourceValid(d)) : [];
     }
-    this.propagateChange(datasources);
+    if (this.propagateChange) {
+      this.propagateChange(datasources);
+      this.propagateChangePending = false;
+    } else {
+      this.propagateChangePending = true;
+    }
   }
 
   public onDatasourceDrop(event: CdkDragDrop<string[]>) {