diff --git a/public/mix-manifest.json b/public/mix-manifest.json
index 55824fab6c..035f885790 100644
--- a/public/mix-manifest.json
+++ b/public/mix-manifest.json
@@ -1,5 +1,5 @@
 {
-    "/js/orchid.js": "/js/orchid.js?id=a32cdcbad9af7ccc0e7211f1b52f0231",
+    "/js/orchid.js": "/js/orchid.js?id=b38d24bdcd6c7fb02bc3f4a271ed1c9f",
     "/js/manifest.js": "/js/manifest.js?id=fa18bd350409678078668239241217f5",
     "/css/orchid.rtl.css": "/css/orchid.rtl.css?id=2213fd09462f8dd4f3acae159ae54f0b",
     "/css/orchid.css": "/css/orchid.css?id=3e939be34f2a645f71de1a53bb673211",
diff --git a/resources/js/controllers/listener_controller.js b/resources/js/controllers/listener_controller.js
index 68ff4e9041..b73b8a4a87 100644
--- a/resources/js/controllers/listener_controller.js
+++ b/resources/js/controllers/listener_controller.js
@@ -3,6 +3,12 @@ import ApplicationController from "./application_controller";
 export default class extends ApplicationController {
     listenerEvent = () => this.render();
 
+    /**
+     * Mutation Observer for matrix.
+     * @type {null|MutationObserver}
+     */
+    observer = null;
+
     /**
      *
      */
@@ -14,23 +20,39 @@ export default class extends ApplicationController {
      *
      */
     addListenerForTargets() {
+        this.observer.disconnect();
+
         this.targets.forEach(name => {
             document.querySelectorAll(this.selectorFromTarget(name))
-                .forEach((field) =>
-                    field.addEventListener('change', this.listenerEvent, {
-                        once: true
-                    })
+                .forEach((field) => {
+                        field.addEventListener('change', this.listenerEvent, {
+                            once: true
+                        });
+
+                        let matrix = field.closest('table.matrix tbody');
+                        if(!!matrix) this.addListenerToMatrix(matrix);
+                    }
                 );
         });
     }
 
+    /**
+     *
+     * @param {Element} matrix
+     */
+    addListenerToMatrix(matrix) {
+        let options = { attributes: false, childList: true, subtree: false };
+        this.observer = new MutationObserver(() => this.addListenerForTargets());
+        this.observer.observe(matrix, options);
+    }
+
     /**
      *
      * @param {string} name
      * @return {string}
      */
     selectorFromTarget(name) {
-        if(name.includes('*')) {
+        if (name.includes('*')) {
             return name.split('*').reduce((prev, cur) => prev + `[name*="${cur}"]`, '');
         }
         return `[name="${name}"]`;