diff --git a/src/main.html b/src/main.html
index fb888c3..7e0fe0c 100644
--- a/src/main.html
+++ b/src/main.html
@@ -27,7 +27,7 @@
     </div>
 
     <div class="w-full sticky top-100vh">
-      <form class="bg-white shadow-md rounded px-8 pt-6 pb-8 mb-4">
+      <form id="chat-form" class="bg-white shadow-md rounded px-8 pt-6 pb-8 mb-4">
         <div class="mb-4">
           <input class="shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline" id="username" type="text" placeholder="Query...">
         </div>
diff --git a/src/main.js b/src/main.js
index 3bb5c60..f3e9318 100644
--- a/src/main.js
+++ b/src/main.js
@@ -35,3 +35,20 @@ const ollama_chat_complete = async (model, messages) => {
   const js = await res.json()
   return js
 }
+
+const form = document.getElementById('chat-form')
+
+form.addEventListener('submit', FormSubmit);
+
+function FormSubmit(event) {
+  // do we have to prevent default form submission behaviour? im not sure
+  const query = document.getElementById('username').value;
+
+  FutureFunction(query);
+}
+
+function FutureFunction(query) {
+  // we put everything that happens with the query here
+}
+
+