diff --git a/front/static/edit_report.html b/front/static/edit_report.html
index 2ccac85..1ff63e6 100644
--- a/front/static/edit_report.html
+++ b/front/static/edit_report.html
@@ -86,7 +86,7 @@
                 <div class="modal-footer">
                     <button type="button" class="btn btn-danger delete-report">Delete Report</button>
                     <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
-                    <button type="button" class="btn btn-primary">Submit Report</button>
+                    <button type="button" class="btn btn-primary submit-report-button">Submit Report</button>
                 </div>
             </div>
         </div>
diff --git a/front/static/js/viewHistory.js b/front/static/js/viewHistory.js
index 4cf4048..a5ad6cf 100644
--- a/front/static/js/viewHistory.js
+++ b/front/static/js/viewHistory.js
@@ -225,6 +225,12 @@ function createReportForm(parsedData, type) {
     const accordion = document.createElement("div");
     accordion.classList.add("accordion");
 
+    //submit button
+    const submitButton = document.querySelector(".submit-report-button");
+    if (submitButton) {
+        submitButton.setAttribute("data-rid", parsedData.report_pk);
+    }
+
     if (type === reportType.EDIT) {
         modalBody = document.querySelector("#editReportModalBody");
         modalLabel = document.querySelector("#editReportModalLabel");
@@ -295,7 +301,7 @@ function displayListOfReports(parsedData) {
     const cardBody = document.querySelector(".card-body");
     const table = document.querySelector("table");
     cardBody.removeChild(cardBody.firstElementChild); // remove loading spinner
-    
+
     if (reports.length === 0) {
         cardBody.removeChild(table);
         const h5 = document.createElement("h5");
@@ -427,6 +433,17 @@ document.addEventListener("click", function(event) {
             console.log("View button clicked");
             const url = getEndpointDomain() + "api/v1/report/" + event.target.dataset.rid;
             makeAjaxRequest("GET", url, displayReport);
+        } else if (event.target.classList.contains("submit-report-button")) {
+            event.preventDefault();
+            //const title = document.querySelector("#editReportModalLabel").textContent;
+            const result = confirm("Are you sure you want to submit the report ?");
+            if (result) {
+                const url = getEndpointDomain() + "api/v1/report/" + event.target.dataset.rid;
+                makeAjaxRequest("PUT", url, function(parsedData) {
+                    alert(parsedData.message);
+                    location.reload(true);
+                });
+            }
         } else if (event.target.classList.contains("delete-report")) {
             event.preventDefault();
             const title = document.querySelector("#editReportModalLabel").textContent;
@@ -473,7 +490,7 @@ document.addEventListener("submit", function(event) {
         saveButton.innerHTML = "";
         let span = document.createElement("span");
         span.classList.add("spinner-border", "spinner-border-sm");
-        saveButton.appendChild(span); 
+        saveButton.appendChild(span);
         saveButton.appendChild(document.createTextNode("  Saving..."));
         const formData = new FormData(event.target);
         const url = getEndpointDomain() + "api/v1/report/" + event.target.dataset.rid + "/section/" + event.target.dataset.sid;
diff --git a/front/static/new_report.html b/front/static/new_report.html
index dc9ca28..00aee91 100644
--- a/front/static/new_report.html
+++ b/front/static/new_report.html
@@ -76,7 +76,7 @@
                 </div>
                 <div class="modal-footer">
                     <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
-                    <button type="button" class="btn btn-primary">Submit Report</button>
+                    <button type="button" class="btn btn-primary submit-report-button" >Submit Report</button>
                 </div>
             </div>
         </div>