Fixed key information updating, added loading + success messages

src/main/resources/static/js/businessInformation.js

@@ -15,15 +15,33 @@ async function submitFile(inputName) {
                 }
             };
             xhttp.send(formData);
+        }else{
+            reject("")
         }
     })
 }
 
 async function submitInfo(shopId) {
-    let bannerName = await submitFile("bannerInput");
-    let logoName = await submitFile("logoInput")
+
+    document.getElementById("saveInfoButton").classList.add("is-loading")
+
+    let bannerName, logoName
+    try{
+        bannerName = await submitFile("bannerInput");
+    }catch(e){
+        console.log(e)
+        bannerName = ""
+    }
+    try{
+        logoName = await submitFile("logoInput");
+    }catch(e){
+        console.log(e)
+        logoName = ""
+    }
     var xhttp = new XMLHttpRequest();
 
+
+
     let params = "shopId=" + shopId
     params += "&shopName=" + encodeURIComponent(document.getElementById("nameInput").value)
     params += "&shopDescription=" + encodeURIComponent(document.getElementById("descriptionInput").value)
@@ -34,7 +52,9 @@ async function submitInfo(shopId) {
     xhttp.onload = function () {
         if (xhttp.readyState === 4 && xhttp.status === 200) {
             var response = xhttp.responseText
-            if (response == "success") {
+            if (response == "OK") {
+                document.getElementById("saveInfoButton").classList.remove("is-loading")
+                document.getElementById("infoSuccess").innerHTML = "Changes Saved!"
             } else {
             }
         } else {

src/main/resources/templates/fragments/businessInformation.html

@@ -47,7 +47,8 @@
         </label>
     </div>
 
-    <button th:onclick="'submitInfo('+ ${shop.shopId} +');'" class="button is-link" style="margin-top:15px; margin-bottom:10px;">Save changes</button>
+    <button id="saveInfoButton" th:onclick="'submitInfo('+ ${shop.shopId} +');'" class="button is-link" style="margin-top:15px; margin-bottom:10px;">Save changes</button>
+    <p class="help is-success" id="infoSuccess"></p>
 </div>
 <p style="border-bottom: #000000 1px solid;"></p>
 </body>