diff --git a/EnvelopeGenerator.Web/Views/Home/ShowEnvelope.cshtml b/EnvelopeGenerator.Web/Views/Home/ShowEnvelope.cshtml
index fa60f8a9..6120656d 100644
--- a/EnvelopeGenerator.Web/Views/Home/ShowEnvelope.cshtml
+++ b/EnvelopeGenerator.Web/Views/Home/ShowEnvelope.cshtml
@@ -114,15 +114,15 @@
                 <div class="modal-body">
                     <div class="input-group mb-3">
                         <span class="input-group-text">E-Mail</span>
-                        <input type="text" class="form-control" placeholder="user@samplemail.com" aria-label="">
+                        <input type="text" class="form-control" placeholder="user@samplemail.com" id="readonly-receiver-mail" aria-label="">
                     </div>
                     <div class="input-group">
                         <span class="input-group-text">Gültig bis</span>
-                        <input type="date" name="expiration" class="form-control">
+                        <input type="date" name="expiration" class="form-control" id="readonly-date-valid">
                     </div>
                 </div>
                 <div class="modal-footer">
-                    <button type="button" class="btn btn-primary">
+                    <button type="button" class="btn btn-primary" id="readonly-send">
                         <span class="material-symbols-outlined">
                             send
                         </span>
@@ -135,12 +135,17 @@
     <div id='app'></div>
 </div>
 <script nonce="@nonce">
-    document.addEventListener("DOMContentLoaded", function () {
-        const shareButton = document.querySelector('.dd-card-preview button');
+    document.getElementById('readonly-send').addEventListener('click', async () => {
+        const receiverMail = document.getElementById('readonly-receiver-mail').value;
+        const dateValid = document.getElementById('readonly-date-valid').value;
 
-        shareButton.addEventListener('click', function () {
-            // click action logic
-        });
+        await shareEnvelope(receiverMail, dateValid)
+            .then(res => {
+                console.log(res)
+            })
+            .catch(err => {
+                console.log(err)
+            })
     });
 
     const collapseNav = () => {
diff --git a/EnvelopeGenerator.Web/wwwroot/js/api-service.js b/EnvelopeGenerator.Web/wwwroot/js/api-service.js
index cac4816e..fb300853 100644
--- a/EnvelopeGenerator.Web/wwwroot/js/api-service.js
+++ b/EnvelopeGenerator.Web/wwwroot/js/api-service.js
@@ -14,7 +14,7 @@ class API {
   }
 
   static get SHARE_URL() {
-    return `/readonly`
+    return `/api/readonly`
   }
 
   static __XSRF_TOKEN
@@ -56,4 +56,4 @@ const redirect = (url) => window.location.href = url;
 
 const redirRejected = () => redirect(API.REJECT_REDIR_URL);
 
-const shareEnvelope = (receiverMail, dateValid) => createPost(API.SHARE_URL, { receiverMail: receiverMail, dateValid: dateValid });
\ No newline at end of file
+const shareEnvelope = (receiverMail, dateValid) => createPost(API.SHARE_URL, { receiverMail: receiverMail, dateValid: dateValid }, Content.JSON);
\ No newline at end of file
diff --git a/EnvelopeGenerator.Web/wwwroot/js/api-service.min.js b/EnvelopeGenerator.Web/wwwroot/js/api-service.min.js
index a5294ecf..88783099 100644
--- a/EnvelopeGenerator.Web/wwwroot/js/api-service.min.js
+++ b/EnvelopeGenerator.Web/wwwroot/js/api-service.min.js
@@ -1,2 +1,2 @@
-class Content{static get JSON(){return"application/json"}}class API{static get REJECT_URL(){return`/api/envelope/reject`}static get REJECT_REDIR_URL(){return`/envelopekey/${API.ENV_KEY}/rejected`}static get SHARE_URL(){return`/readonly`}static __XSRF_TOKEN
-  static get XSRF_TOKEN(){return API.__XSRF_TOKEN??=document.getElementsByName("__RequestVerificationToken")[0].value,API.__XSRF_TOKEN}static get ENV_KEY(){return ENV_KEY??document.querySelector('meta[name="env-key"]').getAttribute("content")}}const submitForm=async n=>await fetch(n.action,{method:n.method,body:new FormData(n),headers:{"X-Requested-With":"XMLHttpRequest"}}),createRequest=async(n,t,i,r)=>fetch(t,{credentials:"include",method:n,headers:{"Content-Type":r,"X-XSRF-TOKEN":API.XSRF_TOKEN},body:JSON.stringify(i)}),createPost=(n,t,i)=>createRequest("POST",n,t,i),rejectEnvelope=n=>createPost(API.REJECT_URL,n,Content.JSON),redirect=n=>window.location.href=n,redirRejected=()=>redirect(API.REJECT_REDIR_URL),shareEnvelope=(n,t)=>createPost(API.SHARE_URL,{receiverMail:n,dateValid:t});
\ No newline at end of file
+class Content{static get JSON(){return"application/json"}}class API{static get REJECT_URL(){return`/api/envelope/reject`}static get REJECT_REDIR_URL(){return`/envelopekey/${API.ENV_KEY}/rejected`}static get SHARE_URL(){return`/api/readonly`}static __XSRF_TOKEN
+  static get XSRF_TOKEN(){return API.__XSRF_TOKEN??=document.getElementsByName("__RequestVerificationToken")[0].value,API.__XSRF_TOKEN}static get ENV_KEY(){return ENV_KEY??document.querySelector('meta[name="env-key"]').getAttribute("content")}}const submitForm=async n=>await fetch(n.action,{method:n.method,body:new FormData(n),headers:{"X-Requested-With":"XMLHttpRequest"}}),createRequest=async(n,t,i,r)=>fetch(t,{credentials:"include",method:n,headers:{"Content-Type":r,"X-XSRF-TOKEN":API.XSRF_TOKEN},body:JSON.stringify(i)}),createPost=(n,t,i)=>createRequest("POST",n,t,i),rejectEnvelope=n=>createPost(API.REJECT_URL,n,Content.JSON),redirect=n=>window.location.href=n,redirRejected=()=>redirect(API.REJECT_REDIR_URL),shareEnvelope=(n,t)=>createPost(API.SHARE_URL,{receiverMail:n,dateValid:t},Content.JSON);
\ No newline at end of file