diff --git a/src/LiveComponent/assets/dist/live_controller.js b/src/LiveComponent/assets/dist/live_controller.js
index 94c9f8dd0ca..ba0959b7a51 100644
--- a/src/LiveComponent/assets/dist/live_controller.js
+++ b/src/LiveComponent/assets/dist/live_controller.js
@@ -2671,7 +2671,11 @@ class SetValueOntoModelFieldsPlugin {
         });
     }
     synchronizeValueOfModelFields(component) {
-        component.element.querySelectorAll('[data-model]').forEach((element) => {
+        const modelFields = [
+            ...Array.from(component.element.querySelectorAll('[data-model]')),
+            ...Array.from(component.element.querySelectorAll('form,input,select,textarea')),
+        ];
+        modelFields.forEach((element) => {
             if (!(element instanceof HTMLElement)) {
                 throw new Error('Invalid element using data-model.');
             }
diff --git a/src/LiveComponent/assets/src/Component/plugins/SetValueOntoModelFieldsPlugin.ts b/src/LiveComponent/assets/src/Component/plugins/SetValueOntoModelFieldsPlugin.ts
index 9606c487348..e539a2b63ec 100644
--- a/src/LiveComponent/assets/src/Component/plugins/SetValueOntoModelFieldsPlugin.ts
+++ b/src/LiveComponent/assets/src/Component/plugins/SetValueOntoModelFieldsPlugin.ts
@@ -30,7 +30,12 @@ export default class implements PluginInterface {
      * the "firstName" model.
      */
     private synchronizeValueOfModelFields(component: Component): void {
-        component.element.querySelectorAll('[data-model]').forEach((element: Element) => {
+        const modelFields = [
+            ...Array.from(component.element.querySelectorAll('[data-model]')),
+            ...Array.from(component.element.querySelectorAll('form,input,select,textarea')),
+        ];
+
+        modelFields.forEach((element: Element) => {
             if (!(element instanceof HTMLElement)) {
                 throw new Error('Invalid element using data-model.');
             }